SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Enthusiast
    Join Date
    Sep 2006
    Posts
    93
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Extra space in IE 6

    Canít figure out why thereís extra space between elements on IE 6. In the following link, for example, thereís an extra 14 pixels of space between the bottom of the header and the top of the left side bar. Any ideas of why this is? The spacing is correct on firefox.

    http://www.launchdirect.com/whycredit/

  2. #2
    SitePoint Enthusiast
    Join Date
    Jan 2006
    Posts
    71
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You have a tag for the closing of a table cell but there is never a table opened to begin with:

    HTML Code:
    <div class="header_rule"></div>
    </div></td>
        <td width="160" rowspan="2" valign="top"><div class="navboxwrapright">

  3. #3
    Guru Meditation Error gnarly's Avatar
    Join Date
    Dec 2003
    Location
    Cheltenham, United Kingdom
    Posts
    692
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes there is - it's just opened before the DOCTYPE, which is complete silliness.

    Praxis, your HTML code is a mess. Can you validate it, then come back and ask again please? http://validator.w3.org/
    Olly Hodgson
    thinkdrastic.net

  4. #4
    SitePoint Enthusiast
    Join Date
    Sep 2006
    Posts
    93
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, s1lentslayer & gnarly.

    There are indeed some validation issues. However, if we go to a page on the site that uses no tables (http://launchdirect.com/whycredit/about-us/) and the doctype is in the first line, the space issue remains the same.

    I used a table on the first page to keep the body and right nav bar from wrapping when the browser window is reduced horizontally. Iíd prefer to use a div to control this if possible so if anyone knows how to do that please let me know.

  5. #5
    SitePoint Enthusiast
    Join Date
    Jan 2006
    Posts
    71
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Add a margin-bottom:0 to header_wrapper or header_rule and see if that fixes it.

  6. #6
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,288
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    If you are talking about the space under the header rule then this is because ie won't size an element when height is defined to be smaller than the current font size.

    To make the elements height less than the current font-size you would need to set font-size to zero or use overflow:hidden.

    Code:
    .header_rule {
    	background-image: url(images/rule-bg.gif);
    	background-repeat: repeat-x;
    	clear: both;
    	margin-top: 7px;
    	height: 4px;
    overflow:hidden;
    }

  7. #7
    SitePoint Enthusiast
    Join Date
    Sep 2006
    Posts
    93
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B
    If you are talking about the space under the header rule then this is because ie won't size an element when height is defined to be smaller than the current font size.

    To make the elements height less than the current font-size you would need to set font-size to zero or use overflow:hidden.

    Code:
    .header_rule {
    	background-image: url(images/rule-bg.gif);
    	background-repeat: repeat-x;
    	clear: both;
    	margin-top: 7px;
    	height: 4px;
    overflow:hidden;
    }
    Excellent, Paul, thanks!


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
  •