Help - Search - Members - Calendar
Full Version: Inheritance question
HTMLHelp Forums > Web Authoring > Cascading Style Sheets
Eddie
Hi,
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>
<td>phone</td>
<td>email</td>
</tr>

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?
Thanks,
Ed
pandy
Because padding isn't inherited. That is, it never is. wink.gif
https://www.w3.org/TR/CSS2/box.html#propdef-padding-left
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.

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


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

CODE
.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'.
https://www.w3.org/TR/2011/REC-CSS2-2011060...ndant-selectors

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.
Christian J
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).
pandy
bgcolor (for TR) and height (for TD) are only allowed in HTML 4.01 Transitional. Move it all to CSS, I say.
Eddie
Thanks for the quick input, I really appreciate it and I'll heed your advice.
Cheers,
Ed
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2019 Invision Power Services, Inc.