PDA

View Full Version : Codes explanation


ATMA
12-24-2008, 06:26 AM
I'm trying learn and edit some codes. Below is part of the navigation code


.nav li a:hover{background:#666;color:$bordercolor!importa nt;width:95px;}
* html .nav li a:hover{background:$titlecolor;width:99px;}

What is * html ?
What does the 2nd line do? I've tried playing with the background:$titlecolor but I couldn't see any difference.

Rarst
12-24-2008, 03:24 PM
Second rule probably works but that way it's written in doesn't make much sense to me.

* is universal selector, it matches anything.
html is top-level container that is open in the very start of page and closed in the very end. <html></html>
.nav is anything with nav class.
li is list item.
a:hover is hyperlink when cursor is pointed at it.

PS that may be some cross-browser hack, I am no expert on those

ap4a
12-24-2008, 03:46 PM
The second line loads a CSS ruleset for IE 6 and under that is intended to override the settings used in the first line. The use of * html is a hack for IE 6 and under (nothing can be a parent of the html element, so no browser should recognise a selector of * html, but IE 6 does). So check in IE 6 (or 5x) to see the effect. The use of a variable ($titlecolor) for the background suggests that the CSS is being loaded dynamically via PHP or some other script type, and so it presumably is being set elsewhere.

ATMA
12-25-2008, 01:41 AM
Season's greetings! And thx for replying..

The second line loads a CSS ruleset for IE 6 and under that is intended to override the settings used in the first line. The use of * html is a hack for IE 6 and under (nothing can be a parent of the html element, so no browser should recognise a selector of * html, but IE 6 does). So check in IE 6 (or 5x) to see the effect. The use of a variable ($titlecolor) for the background suggests that the CSS is being loaded dynamically via PHP or some other script type, and so it presumably is being set elsewhere.

I see, so if I understand correctly, the 2nd line with * html does the same thing as the first line, but only in IE 6 and under, right?

Is it even worth nowadays to go through all the trouble to make sure your site looks right in IE? Firefox and co seems like the de facto standard for browsing nowadays..

ap4a
12-25-2008, 01:19 PM
I see, so if I understand correctly, the 2nd line with * html does the same thing as the first line, but only in IE 6 and under, right?

It targets the same element in IE 6 and under, but with greater specificity so that it overrides the previous rule set. In that way you can apply fixes or adjustments to get around IE 6's bugs.

However using conditional comments to target IE versions is a far better method.

Is it even worth nowadays to go through all the trouble to make sure your site looks right in IE? Firefox and co seems like the de facto standard for browsing nowadays..

IE generically? Or IE 6 specifically?

If you're happy ignoring 80% of web users then ignore IE entirely. Or if you're happy with ignoring around 30% of users then ignore IE 6. As far as Firefox and co being any kind of de facto standard, they aren't. They are still minority browsers with IE 6 still having greater market share than Firefox, Opera, Safari and Camino all combined (http://www.thecounter.com/stats/2008/November/browser.php).

ATMA
12-28-2008, 07:30 AM
It targets the same element in IE 6 and under, but with greater specificity so that it overrides the previous rule set. In that way you can apply fixes or adjustments to get around IE 6's bugs.

However using conditional comments to target IE versions is a far better method.



IE generically? Or IE 6 specifically?

If you're happy ignoring 80% of web users then ignore IE entirely. Or if you're happy with ignoring around 30% of users then ignore IE 6. As far as Firefox and co being any kind of de facto standard, they aren't. They are still minority browsers with IE 6 still having greater market share than Firefox, Opera, Safari and Camino all combined (http://www.thecounter.com/stats/2008/November/browser.php).

Is there any site dedicated to the topic of IE compatibility blog design or specially for blogger? I suppose the sooner I learn about this, the better.

ap4a
12-28-2008, 01:29 PM
Not specifically for blog design: http://www.positioniseverything.net/