hasLayout.net

Bookmark and Share

Star HTML Bug

Table of Contents

Affected Versions

This bug affects: IE6

Symptoms

* html selector is not ignored in IE6 (due to unversal selector being ignored when it's the first part of the selector)

Date of the Tutorial

Mon Aug 10 04:42:20 2009

Description

This bug is more of a tool for applying specific rulesets to IE6 rather than something that bites you when you sleep. Let's take a look at the demo:

Demo

Due to the nature of the bug, the demo is available on a separate page

HTML Code:
div {
    width: 200px;
    padding: 50px;
    margin: 0 auto;
    background: #ddd;
}

* html div {
    background: #00f;
}
CSS Code:
<div></div>

Since <html> element is considered the root element by sane browsers, there's nothing to select above it with universal selector (the star). For that reason the * html is ignored by sane browsers but what happens in IE6 is that the universal selector is ignored when it's the first part of the selector, therefore, for IE6 it simply becomes html.

Our * html div selector is ignored by sane browsers and in IE6 it becomes html div, which is more specific than the previous div selector and that effectively causes our <div> to obtain blue color in IE6 specifically.

Solutions

Below are solutions for the above bug ordered by the solution type.

Solution (Clean Solution)

Date of the Solution

Mon Aug 10 04:48:14 2009

Fixed Versions

All of the affected

Description

As I've mentioned earlier, this bug is used to target IE6 rather than causes the usuall annoyment; I doubt you'd be needing a "fix" for it. Let's glance at the fixed demo:

Due to the nature of the bug, fixed demo is available on a separate page

HTML Code:
<div></div>
CSS Code:
div {
    width: 200px;
    padding: 50px;
    margin: 0 auto;
    background: #ddd;
}

html div {
    background: #00f;
}

Since universal selector is rather useless for specificity, I simply removed it from our selector. Now the <div> is blue in all the browsers.

Comments

Create new comment

Currently there are no posted comments.

If you found materials on this site useful, please consider donating a few bucks to the author. Thank you.

Alternatively, purchase my book: