Inheritance question |
Inheritance question |
Eddie |
May 4 2017, 02:55 PM
Post
#1
|
Group: Members Posts: 4 Joined: 4-May 17 Member No.: 26,395 |
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 |
May 4 2017, 03:14 PM
Post
#2
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,732 Joined: 9-August 06 Member No.: 6 |
Because padding isn't inherited. That is, it never is.
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 |
May 4 2017, 04:23 PM
Post
#3
|
. Group: WDG Moderators Posts: 9,661 Joined: 10-August 06 Member No.: 7 |
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 |
May 4 2017, 04:40 PM
Post
#4
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,732 Joined: 9-August 06 Member No.: 6 |
bgcolor (for TR) and height (for TD) are only allowed in HTML 4.01 Transitional. Move it all to CSS, I say.
|
Eddie |
May 4 2017, 07:30 PM
Post
#5
|
Group: Members Posts: 4 Joined: 4-May 17 Member No.: 26,395 |
Thanks for the quick input, I really appreciate it and I'll heed your advice.
Cheers, Ed |
Lo-Fi Version | Time is now: 27th April 2024 - 02:02 AM |