SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Enthusiast
    Join Date
    Oct 2005
    Posts
    28
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Unhappy Long copy breaks page in FF

    Can somebody explain why the longest pages break in Firefox?

    http://www.bmwebdes.com/test/acfilte...ing_filter.htm
    http://www.bmwebdes.com/test/acfilte...nd_service.htm
    http://www.bmwebdes.com/test/acfilte...nditioning.htm

    http://www.bmwebdes.com/test/acfilter/global.css

    The main content is within the following divs: #content and #content #main.

    They all look good in IE. The other pages look fine in FF as well, but it seems like as soon as the copy reaches as certain vertical lenght the page breaks.

    I want the page to stretch at a 100% height.

    I am not sure what I am doing wrong and what the solution is. Any suggestion is very much appreciated. Thank you

    Happy 4th to all!
    Barbara

  2. #2
    SitePoint Enthusiast ada80ro's Avatar
    Join Date
    Apr 2005
    Posts
    64
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You'll have to use the clearfix hack on the #content div.
    More details here:
    http://www.positioniseverything.net/easyclearing.html

  3. #3
    SitePoint Enthusiast
    Join Date
    Oct 2005
    Posts
    28
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you, but this is not working for me. I tried to implement it tryong different placements in the HTML, but no luck.

    So, I don't know ifI am doing it wrong or if ut just wasn't the fix for my problem.

    Any other suggestion? Thanks.

  4. #4
    SitePoint Wizard silver trophybronze trophy Nadia P's Avatar
    Join Date
    Oct 2004
    Location
    NSW Australia
    Posts
    3,564
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I added clear: both to the ul#footer and that moved the footer links down.

    I would first fix the validation errors in your html and then try and validate the css (can't do that now because the xhtml doesn't validate) and see where the page stands at that point.

    Nadia

  5. #5
    SitePoint Enthusiast ada80ro's Avatar
    Join Date
    Apr 2005
    Posts
    64
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi, I've tested with the clearifix hack and it works if you remove height:100% from #container.
    1. Add this class to global.css:
    Code:
    /*start clear hack*/
    .clearfix:after {
        content: ".";
       display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }
    /*hide from ie-mac\*/
    * html .clearfix {height: 1%;}
    /*hide from ie-mac*/
    2. remove height:100% from #container
    3. and then:
    <div id="content" class="clearfix"> in the html page


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
  •