CSS Quicktip: Borders Inherit Colors

March 9th, 2007 by Jerome Dahdah

Here’s a quick little something you may not have known about CSS borders.

The border shorthand can be used without providing a color value. This is completely valid CSS:

border: 1px solid;

Now that’s not so interesting in itself, right? What makes this interesting is the fact that when you don’t provide a border color value, it inherits the color value of the container, making it the same color as the text it surrounds.

border: 1px solid; color: #c00;

This might save you a little code the next time you’re styling links with borders instead of text-decoration, like when you’re using anything other than the standard underline:

example link

Got any more CSS time savers? Let us know in the comments!

2 Responses to “CSS Quicktip: Borders Inherit Colors”

  1. cram says:

    Das hat Dir der Teufel verraten!
    The devil told you that!

  2. Grim... says:

    Interesting…


By continuing to use the site, you agree to the use of cookies. more information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.

Close