CSS Why is this tablecell not left aligned?
I'm attempting to create a table with the first cell left justified, and all the other cells centered.
I am able to do this, but thought I'd use a different CSS technique, and it's got me stumped.
In the example below, i would think the table cell with class="left" would take precedence over the table level center alignment, but this does not seem to be the case. All cells are centered.
All inputs appreciated!
<head>
<style type="text/css">
td {border:solid 1px black;}
table.SomeTable td {text-align:cente开发者_运维百科r;}
td.Left {text-align:Left;}
</style>
</head>
<body>
<table class="SomeTable" cellpadding="10" cellspacing="0">
<tr>
<td style="width:100px;" class="Left">Why not left justified?</td>
<td style="width:100px;">aaa</td>
<td style="width:100px;">aaa</td>
<td style="width:100px;">aaa</td>
</tr>
</table>
</body>
The table.SomeTable td
rule is indeed more specific than td.Left
.
You can fix it by adding the table class:
table.SomeTable td.Left {text-align:Left;}
here's some background on how CSS specificity works: Points in CSS specificity
精彩评论