SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Evangelist
    Join Date
    Nov 2004
    Location
    Netherlands
    Posts
    541
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    a fix explained please

    In my CSS I have this:
    Code:
    html, body {
     margin:0;
     padding:0;
     background:#fcffec;
     color:#333;
     font:11px Verdana, Arial, Helvetica, sans-serif;
    }
    body {
     padding:4px;
    }
    #content {
     width:770px;
     margin:0 auto;
     
     text-align: justify;
    position:relative;
    }
    * html #content {width:772px;w\idth:770px;}
    I want to make the width for the #content 800px, is the *html#content {width:802px;w\idth:800px;} now? What is this peace of coding doing?

    Thanks explaining.

  2. #2
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's a hack for IE5.x/Win.

    The main rule (#content) sets width:770px.
    The next rule is served to IE only, since it has a bug that matches * html.
    The first declaration in that rule sets width:772px, to cater to IE5's incorrect box model.
    The second declaration resets the width to 770px for IE6, using a hack that relies on IE5 not understanding w\idth.

    If you want to change the width to 800px, the second rule should probably be
    Code:
    * html #content {width:802px; w\idth:800px}
    (Make sure the get the spaces right in the selector.)
    Birnam wood is come to Dunsinane

  3. #3
    SitePoint Addict
    Join Date
    Feb 2005
    Location
    Brisbane, Australia
    Posts
    306
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ugh... That's an ugly hack if I've ever seen one.

    Firstly, the * html is blocking all browsers but Internet Explorer from seeing and applying the following rules.

    Secondly, the \ prevents Macintosh IE5 from applying the second width rule. With other browsers, the 772px is overridden by the 770px.

    At least, that is my understanding of the above.

    In future, I would suggest that conditional comments be used. Hacks should only ever be a last resort, in my opinion.


    Edit: Looks like AutisticCuckoo got in first...


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •