aThortoriece23
New Member
This is more of a "tell me why it doesn't work" instead of "help me fix it" question. If I try to apply padding to a thead or tr element within a table, it doesn't work. The only way padding works is if I apply it directly to the th or td element. Why is this so? Is there an easy way to apply padding to the entire thead or tr or is adding it to the th and td the only option?\[code\]<table> <thead> <tr> <th>Destination</th> <th>Size</th> <th>Home Value</th> </tr> </thead> <tbody> <tr> <td>test 1</td> <td>test 2</td> <td>test 3</td> </tr> </tbody></table>\[/code\]Notice the 10px of padding on the thead.\[code\]table { width: 100%;}thead { text-align: left; background-color: yellow; padding: 10px;}\[/code\]http://jsfiddle.net/5VQB7/