SitePoint Sponsor

User Tag List

Results 1 to 13 of 13
  1. #1
    SitePoint Evangelist Pixelateur's Avatar
    Join Date
    Feb 2006
    Location
    Hamburg, Germany
    Posts
    593
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Funny Gap under footer div

    Hi, please check out my new project.

    Can somebody tell me why there's a white gap just under the black footer bar in Firefox and Safari??

    IE6 looks OK in this case (really unusual actually...)

    Thanks for any feedback.

  2. #2
    SitePoint Member
    Join Date
    Dec 2007
    Location
    Germany, Hannover
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello there,
    I commented out this line:
    /*#wrapper:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}*/
    - et voilá! It Works in firefox.
    In IE7, you have a 1 or 2 pixel-gap on the right, though.

    Greetings from Hannover!
    Roland

  3. #3
    SitePoint Evangelist Pixelateur's Avatar
    Join Date
    Feb 2006
    Location
    Hamburg, Germany
    Posts
    593
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You were absolutely right, Roland! However, commenting out that line made the wrapper div collapse. I fixed this by adding a simple <br clear="all" /> just before the closing tag of the wrapper div. Thanks for helping!!

    Best wishes from Hamburg!

  4. #4
    SitePoint Evangelist Pixelateur's Avatar
    Join Date
    Feb 2006
    Location
    Hamburg, Germany
    Posts
    593
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    BTW, I still haven't got a clou how to remove that ugly white gap on the right (in Internet Explorer). It's a result of the repeated background-image that I'm using on the html tag in CSS. In all other browsers it looks gorgeous though...

    Any ideas on that one?

  5. #5
    SitePoint Zealot theawristocrat's Avatar
    Join Date
    Dec 2007
    Location
    Karakura
    Posts
    168
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Id like to check the "funny" part but it seems your site is down..

  6. #6
    SitePoint Member
    Join Date
    Dec 2007
    Location
    Germany, Hannover
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, use the usual conditional comment and reduce the width of the "wrapper" by one px solves it for IE7.
    A shame, though, that you had to put this stupid little line <br class="aall" />
    in that otherwise perfectly semantic piece of code...
    Dan Cederholm describes a couple of alternative clearing-techniques in his beautiful book "bulletproof webdesign". I got a german copy of it via amazon for 25€. Maybe you can google for some of this stuff:
    "einfaches clearing mit overflow", and he described one trick of how the content of a div is cleared by giving both inner and outer div (given two boxes) a float.
    Anyway, I hope I've been helpful
    Happy Coding!
    Roland

  7. #7
    SitePoint Evangelist Pixelateur's Avatar
    Join Date
    Feb 2006
    Location
    Hamburg, Germany
    Posts
    593
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Roland,

    Thanks for your recommendations. Believe it or not, but I am holding a copy of Dan's book here on my desk. The trick I used initially was also inspired by his book, however it made my footer look larger than it actually was in some browsers. Can you tell me if the page looks OK now in IE6 and IE7? I left the office yesterday and no longer have access to a PC :-(

    Besten Gruss auch...

  8. #8
    SitePoint Member
    Join Date
    Dec 2007
    Location
    Germany, Hannover
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Pixelateur,
    I just had a look in IE7 and IE6. I'm afraid there's still some work to do for these browsers. White gaps between header and right, header and navi, footer and right. But should be easy to solve with conditional comments and some width/margin adjustments.

    LG Roland

  9. #9
    SitePoint Evangelist Pixelateur's Avatar
    Join Date
    Feb 2006
    Location
    Hamburg, Germany
    Posts
    593
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Roland, it's all fixed now. I simply combined the wrapper background and its dropshadow in a single PNG-file and applied it to the background of the wrapper id. This is way better than applying it to the body-tag (as previously). The new site can be found here. Let me know if you find any more bugs. Thanks again for helping in this matter...

  10. #10
    SitePoint Member
    Join Date
    Dec 2007
    Location
    Germany, Hannover
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Still minor flaws in IE5.5 and Firefox

    I took a glance in IE6 and IE7, looks perfect. IE 5.5 is still funny, though. Right content-border and footer are not quite in place. And in firefox, you still have a probably not intended white gap between header and Navigation...

  11. #11
    SitePoint Evangelist Pixelateur's Avatar
    Join Date
    Feb 2006
    Location
    Hamburg, Germany
    Posts
    593
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It seems you have more browsers installed on your machine than I do! The white gap just above the left column menu is intended, don't worry too much about it. Thanks again for helping!

  12. #12
    SitePoint Member
    Join Date
    Dec 2007
    Location
    Germany, Hannover
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This here is a very helpful little tool:
    multiple-ie-setup.exe
    There are a couple of sources. Just google it. It installs mutltiple "virtual" versions of IE.

    HTH Roland

  13. #13
    SitePoint Evangelist Pixelateur's Avatar
    Join Date
    Feb 2006
    Location
    Hamburg, Germany
    Posts
    593
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yeah, but not on a Mac I suppose :-(


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
  •