SitePoint Sponsor |
|
User Tag List
Results 1 to 5 of 5
Thread: Long copy breaks page in FF
-
Jul 4, 2006, 00:23 #1
- Join Date
- Oct 2005
- Posts
- 28
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
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
-
Jul 4, 2006, 00:49 #2
You'll have to use the clearfix hack on the #content div.
More details here:
http://www.positioniseverything.net/easyclearing.html
-
Jul 4, 2006, 21:07 #3
- 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.
-
Jul 4, 2006, 22:36 #4
- 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.
NadiaUnique CSS Templates by Nadia
Dreamweaver: Tutorials.Templates.CSS Designs
SitePoint Books |My Fireworks Tutorials 1 2
Follow me on Twitter | Community Team Advisor
-
Jul 4, 2006, 22:42 #5
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*/
3. and then:
<div id="content" class="clearfix"> in the html page
Bookmarks