Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Cascading Style Sheets _ Inheritance question

Posted by: Eddie May 4 2017, 02:55 PM

I have a problem with <tr> and <td> inheritance.
Here are the details:

HTML code:
<tr bgcolor="#FFFFCB" align="left" valign="middle" class="c19">
<td height="30">Name</td>

css code for class="c19":
.c19 { color: #527531; font-family: verdana,tahoma,arial,helvetica; font-size: 11px; padding-left: 5px; }

The problem is that the <td> cells do not inherit the padding-left from <tr> but they inherit everything else, font color, size, font family.
Can someone tell me why that is?

Posted by: pandy May 4 2017, 03:14 PM

Because padding isn't inherited. That is, it never is. wink.gif
Only some properties are inherited. It would be odd if padding and margin were if you consider how that would effect nested elements.
If margin was inherited, a margin on the DIV in the below example would also result in a margin on the P and the EM, something one wouldn't want in most cases, and you would have to specify null margins for every nested element.

One <em>two</em>three</p>

If you change the selector to the below it will work as you want it to.

.c19 td { color: #527531; font-family: verdana,tahoma,arial,helvetica; font-size: 11px; padding-left: 5px; }

If you don't know, that's called a contextual or descendant selector and it will match any TD that's contained in an element with the class 'c19'.

I would move the HTML attributes you use to CSS too. And it's good practice to finish a font list with a generic font family, sans-serif in your case.

Posted by: Christian J May 4 2017, 04:23 PM

As a sidenote, it's safer and more practical to specify both color and background in the same place (in the CSS), instead of having one as a CSS property and the other as an HTML attribute. Also note that the BGCOLOR, ALIGN and VALIGN attributes are removed in HTML5 (but they're still valid in HTML4).

Posted by: pandy May 4 2017, 04:40 PM

bgcolor (for TR) and height (for TD) are only allowed in HTML 4.01 Transitional. Move it all to CSS, I say.

Posted by: Eddie May 4 2017, 07:30 PM

Thanks for the quick input, I really appreciate it and I'll heed your advice.

Powered by Invision Power Board (
© Invision Power Services (