SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Member
    Join Date
    Sep 2003
    Location
    Oregon
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Unhappy Annoying little gap in IE

    Hello,

    I'm working on a site and have a standard template. An example can be found here, an error page. In Mozilla it looks fine but in IE6 there's a little white gap on the left side of the content box. If this happened identically on all pages this wouldn't be a problem, since I'd just do a little comment hacking and move things over, but if the content box is longer, like here, the gap on the bottom goes away. The problem seems to be related to the floating div#navbar, since the gap goes away if I comment the navbar out. What can I do to fix this?

    Thanks for any help.

  2. #2
    American't awestmoreland's Avatar
    Join Date
    Sep 2002
    Location
    Grand Rapids, MI
    Posts
    1,168
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I would guess that in either your "roundtop" class or your "corner" class there's some padding or border that you could remove. In fact, what happens if you specify "border=0" in your IMG tag?

    I can't check your stylesheet as it's protected.

    in IE, padding goes inside the page element but in NS the padding goes outside the page element as far as I recall. Does the area to the left of the gap look narrower in IE than in NS?


    Andy
    From the English nation to a US location.

  3. #3
    SitePoint Member Ryan8720's Avatar
    Join Date
    Sep 2003
    Location
    USA
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My guess is that it is related to this:

    div#content {
    margin-left: 190px;
    margin-top: 10px;
    margin-right: 20px;
    padding: 0px;
    background: #fff;
    }
    body>#content {
    margin-left: 195px;
    }

    Try switching the margin-left values.

  4. #4
    SitePoint Member
    Join Date
    Sep 2003
    Location
    Oregon
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Oops, permissions are fixed on the stylesheet now. I added border="0" to the top left corner img of #content and that didn't fix it. Here's the corner and roundtop classes:

    Code:
    img.corner {
            width: 15px;
            height: 15px;
            border: none;
            display: block !important;
    }
    div.roundtop {
            background: url("tr-white.gif") no-repeat top right;
    }
    I tried exchanging the margin-left of the two #contents and it just moves the content block.


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
  •