Page is a not externally linkable
- Code, Content, and Presentation
-- CSS
---- CSS Selectors and Page Speed


SuzyUK - 11:15 pm on Mar 10, 2011 (gmt 0)


I can't take it all in.. and posts are getting too long..

but suffice to say I agree we may well arrive at the same point via a different route

I guess that would be tr>td, although that's dumb, even for the dark side


I don't think that's dumb at all, that's using the flow - the natural document flow that is, I mean yes on the surface it may seem to be a bit OTT but.. and I think TABLES are exactly the element to demonstrate this on, if you have a TD that contains some "warning" text .. so you give it, the TD, the class warning, either manually or via JS but you also have a div that contains some warning text the same class. as you intend for them to virtually look the same

but the div has double borders and is padded a bit extra so you can't apply the exact same CSS to a div as a table cell, so you can't just use
.warning {} - if you do it will ultimately affect the entire table layout which you don't want.. how do you decipher between div.warning {} and td.warning {} without the "inefficient" qualifier?

tr > .warning {}
- of course

or even
thead > tr > .warning {} over tbody > tr > .warning {} to differentiate the main td's over the header ones.. that is if the header ones aren't th's , they aren't always.. that's why I say that tables are exactly the logic to illustrate this point with (darn tables are always going to haunt us ;))

now the same goes for


For example, if you need two different styles for an ordered list item and an ordered list item, instead of using two rules:
ul li {color: blue;}
ol li {color: red;}

You could encode the styles into two class names and use those in your rules; e.g:
.unordered-list-item {color: blue;}
.ordered-list-item {color: red;}


hmm yea so that really stopped me using two rules?!?! - not! an li is either a child of an ol or a ul so at it's most efficient, rather than adding class names as suggested by the PS optimisation rules, what's wrong with

ol > li {color: red;}
ul > li {color: blue;}


hmphh I'm with you "what internal logic?"

but then again you won't always get logic from me alt.. I do that in every other walk of life, accounting, databases, spreadsheets, rebooting the digital TV ("it's not a computer mum".. "hmm, yes it is"), you name it I do it.. however CSS is the one "out" that combines, or accepts, both left and right brain logic [is that even possible?] that's why I like (and understand?) it so much ;)


Thread source:: http://www.webmasterworld.com/css/4274514.htm
Brought to you by WebmasterWorld: http://www.webmasterworld.com