SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    Use The Cloud
    Join Date
    Jan 2006
    Location
    Boise, ID
    Posts
    556
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    IE6 Rendering Bug (extra padding-top)

    Take a look at the following piece of code in IE6/Win:

    HTML Code:
    <html>
    <head>
    <style type="text/css">
    #one {
            float: left; } 
    #two {
            background: #ddd;
            clear: left;
            padding: 25px; } 
    </style>
    </head>
    <body>
    
    <div id="one">One</div>
    
    <div id="two">Two</div>
    
    </body>
    </html>
    Notice above "Two" the extra space? Now remove line seven and look again, it looks normal.

    Why is "background" affecting the padding of the element? I can't seem to figure this out.

    I don't usually ask for help very often, but I need some more eyes on this problem.

    Thanks.

  2. #2
    Non-Member
    Join Date
    Jan 2005
    Location
    Netherlands
    Posts
    4,300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello

    use a DTD that gets IE in the same box-model as FF NS Moz Op

    set default padding and margins to 0, then adjust
    *{padding:0;margin:0;}

  3. #3
    Use The Cloud
    Join Date
    Jan 2006
    Location
    Boise, ID
    Posts
    556
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by all4nerds
    Hello

    use a DTD that gets IE in the same box-model as FF NS Moz Op

    set default padding and margins to 0, then adjust
    *{padding:0;margin:0;}
    I just tried it using HTML 4 Transitional/Strict, and XHTML 1 Transitional/Strict with the default padding and margins set to 0 and the problem still persists.

  4. #4
    Non-Member
    Join Date
    Jan 2005
    Location
    Netherlands
    Posts
    4,300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello

    haslayout
    * html #two {height:1%;}


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
  •