Firefox3 rendering help please

	Home Register Search Help Login

Recent Posts
Todays Posts
Most Active posts
Posts since last visit
My Recent Posts
Mark posts read

Sponsors
Shopping Cart Software
Ecommerce software integrated into Frontpage, Dreamweaver and Golive templates. No monthly fees and available in ASP and PHP versions.
Website Templates
We also have a wide selection of Dreamweaver, Expression Web and Frontpage templates as well as webmaster tools and CSS layouts.
Frontpage website templates
Creative Website Templates for FrontPage, Dreamweaver, Flash, SwishMax

Firefox3 rendering help please

View related threads: (in this forum | in all forums)

Logged in as: Guest

Users viewing this topic: none

Printable Version

All Forums >> Web Development >> Cascading Style Sheets and Accessibility >> Firefox3 rendering help please

Page: [1]


GolfMad Posts: 190 Joined: 3/20/2002 From: UK Status: offline	Firefox3 rendering help please - 10/7/2008 11:52:47 In IE7, this site/page under development look fine . In FF3 there are two problems: http://www.sitesoon.co.uk/pen/recycling-materials.php 1. Main problem please, the black background to the header divs, has spread across the whole right/left columns. I have looked for a missing or extra div but cannot find one . 2. On this page and the home page FF3 seems to ignore the padding at the top. Thank you for anyone willing to have a look.


Tailslide Posts: 6692 Joined: 5/10/2005 From: Out here on the raggedy edge Status: offline	RE: Firefox3 rendering help please - 10/7/2008 12:44:03 I'm guessing there's a closing tag missing somewhere - firefox is seeing that whole black area as your class .table750tdheader or whatever. I usually go through and stick in a comment next to the closing tag of each div just to ensure that I don't miss something: </div> <!-- end table750tdheader --> for example. _____________________________ Little Blue Plane Web Design \| Land Rover project (in reply to GolfMad)


GolfMad Posts: 190 Joined: 3/20/2002 From: UK Status: offline	RE: Firefox3 rendering help please - 10/8/2008 1:58:22 Thanks Tailslide. Yes I thought it was in the div tags and looked for hours but could not find it. However, another kind CSS guru like yourself has provided the answer on a different forum so I will post it below as it is a useful principle I guess: quote: Where to stop background colors is not understood by FF (Opera, and others) when the contents are floated. You need to give them an explicit float-cleared stopping point. Tell FF to end the black background by adding "clear:both" to class "table750tdheader" The lack of top padding in FF3 seems to be a difficult one though, as I have Googled it and there seems reams of suggestions and I have tried a few without luck. Not many of the suggestions though relate to FF3, moreFF2. Thanks again for sparing your time to look at the background div problem Tailslide. (in reply to Tailslide)


Tailslide Posts: 6692 Joined: 5/10/2005 From: Out here on the raggedy edge Status: offline	RE: Firefox3 rendering help please - 10/8/2008 2:40:37 It's margin-collapse that's doing it. Try adding clear:both to the singlecolumn div rule. _____________________________ Little Blue Plane Web Design \| Land Rover project (in reply to GolfMad)


GolfMad Posts: 190 Joined: 3/20/2002 From: UK Status: offline	RE: Firefox3 rendering help please - 10/8/2008 3:42:11 Thanks again Tailslide - right on the button and its solved the top padding margin. If and when you have more time could you please explain why this has happened and when the fix should be used as I have not come across this before - is it FF3 or 2 as well? (in reply to Tailslide)


Tailslide Posts: 6692 Joined: 5/10/2005 From: Out here on the raggedy edge Status: offline	RE: Firefox3 rendering help please - 10/8/2008 5:12:34 Actually I take it back - don't think that in this case it was margins or borders collapsing - I think in fact it was due to the preceding floated list not having a height (which is correct to allow for expansion) and therefore (in modern browsers) not really having more than a single line's worth of height allotted to it. People say that when you float something you remove it from the flow of the page but I find that actually you don't totally remove it - it still seems to have about as much height as 1px border. In Firefox if you added outlines to all the block level items using the web developer toolbar you'd see the top of the H1 sitting up just below the top of the nav menu. Adding margins etc doesn't help with this. All you can do is clear the float - this forces the following item to appear below the floated stuff. Then any added margins etc will have their normal effect. _____________________________ Little Blue Plane Web Design \| Land Rover project (in reply to GolfMad)


GolfMad Posts: 190 Joined: 3/20/2002 From: UK Status: offline	RE: Firefox3 rendering help please - 10/8/2008 7:48:58 Thanks for the explanation Tailslide. (in reply to Tailslide)

Page: [1]

All Forums >> Web Development >> Cascading Style Sheets and Accessibility >> Firefox3 rendering help please

Page: [1]

Jump to: 1

New Messages	No New Messages
Hot Topic w/ New Messages	Hot Topic w/o New Messages
Locked w/ New Messages	Locked w/o New Messages

Post New Thread

Reply to Message

Post New Poll

Submit Vote

Delete My Own Post

Delete My Own Thread

Rate Posts