Вопросы Теги

Why doesn't border-color propagate to child elements?

I've got a site I'm building which has deeply nested divs, and uses user selectable themes. My question is... Why doesn't border-color propagate to child elements?

I am already dealing with the DOM stylesheets, so it will not be anything difficult to add a loop to update border colors. Yet I am curious why it is standard (Firefox & Chrome, in Linux) that border color doesn't inherit from the parent, and instead defaults to the text color, and still border-style won't default to solid?

Is there some wisdom behind this behaviour? I'm not trying to be cheaky. I am really curious why this seems to be "by design."

As I've been writing this I realize the simplest, and most flexible solution is to define my elements as class="classname border" and then update the border class to reflect the proper border color.

Still though, I don't understand the why?

Here's a simple bit of html that demonstrates the issue...

<html>
  <head>
    <style type="text/css">
      .content{
        color: red;
        display: inline-block;
        border-width: 2px;
        border-style: solid;
        border-color: yellow;
      }
      .nested{
        color: green;
        display: inline-block;
        border-width: 2px;
        border-style: solid;
        margin: 3px;
      }
    </style>
  </head>
  <body>
    <div class="content">
    Content div. Red text, yellow border.<br>
      <div class="nested">
        Ignores parent border color. Defaults to text color.
      </div>
    </div>
  </body>
</html>

I wouldn't ask this, except I'm fairly sure there are people here who actually commented on the rfc's, and have some background information that might shed some light on the 'why'.

Thanks.

Skip

11
задан BentFX 6 May 2011 в 16:22
поделиться