SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Zealot mrtopher's Avatar
    Join Date
    Mar 2004
    Location
    VA
    Posts
    150
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Strange spacing in IE 6&7

    I've built out a site that looks great in FF and Safari.

    http://dev.practisinc.com

    Problem is, when it's viewed in IE 6 or 7 there are spacing problems with the logo and main nav. I'm using CSS image replacement for both the logo and main nav.

    I've spent a lot of time playing with the margins and padding and can't seem to figure out whats going on here. It almost looks like FF is adding 4 pixels to the top of the branding area that IE isn't. But I have padding and margins zeroed out.

    I'm stumped. Anyone have any ideas?

  2. #2
    SitePoint Wizard bronze trophy Centauri's Avatar
    Join Date
    May 2007
    Location
    Newcastle, Australia
    Posts
    3,718
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try setting the left and top properties of the absloutely positioned image holder spans to zero - sometimes browsers don't like it when they are told to absolutely position something, but not being told where to position it.

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,367
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Yes centauri beat me this time and is exactly right

    Code:
            #branding h1 span { height:100%; width:100%;left:0;top:0; position:absolute; background:url(http://dev.practisinc.com/images/logo.gif) no-repeat; }
        ul#nav_main li a span { width:100%; height:100%; position:absolute;left:0;top:0; }

  4. #4
    SitePoint Zealot mrtopher's Avatar
    Join Date
    Mar 2004
    Location
    VA
    Posts
    150
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That did the trick, thanks!!
    The blog: ChrisMonnat.com


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
  •