Question about selection rules syntax

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

David Stone - 31 Jul 2006 17:27 GMT

I have a table class that I would like to add specific td and th
styles to.

I can do this:

table.mytable { ... }
table.mytable th { ... }
table.mytable td { ... }

but the th and td are going to be styled identically. I found
that doing

table.mytable { ... }
table.mytable th, table.mytable td { ... }

(In this case, I'm trying to style cell borders differently
from the table border, as well as specifying different margins
and padding in the cells compared to the table as a whole.)

worked, but it seems that there ought to be a way of simplifying
even this. Is there (again, assuming that the th and td styles
are going to be identical in this instance)?

Reply to this Message

Steve Pugh - 31 Jul 2006 20:26 GMT

> table.mytable { ... }
> table.mytable th, table.mytable td { ... }
>
>but it seems that there ought to be a way of simplifying
>even this. Is there (again, assuming that the th and td styles
>are going to be identical in this instance)?

Well, depending on the specificity of your other selectors you may be
able to drop the table, i.e. .mytable th, .mytable td { ... }

tr>* will select all td and th elements (as they are the only things
that can be immediate children of tr) so the shortest version is
.mytable tr>* { ... }
but that's useless in the real world as IE<7 doesn't support the child
selector.

Steve

Signature

"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <steve@pugh.net> <http://steve.pugh.net/>

Reply to this Message

Webmaster Forum / HTML, CSS, Scripts / CSS / July 2006

Question about selection rules syntax