View Full Version : <div>'s expanding to content height in FF
04-28-2006, 09:02 PM
In firefox browser I am having trouble with my <div>'s not expanding out height-wise appropriate to its content. Sometimes it does, sometimes it doesn't. All other browsers seem to work fine regarding this. I have attached 2 screenshots to help explain. Any ideas on what I need to set this <div>'s style to to accomedate this appropriatly in FF?
04-28-2006, 11:24 PM
Images are useless in this situation. We need code or a link. I prefer the link.
04-29-2006, 01:01 AM
The problem is not Firefox, it's IE. IE expands divs to contain floated content. This is incorrect behavior. But, like aero said, a specific solution requires a look at your code.
04-29-2006, 09:20 AM
Sorry for that.
Code can be view via this URL: http://www.websolvents.com/forums/
04-29-2006, 12:10 PM
Here's the trick I use for keeping floats inside of DIVs:
This assumes I alread have the #container coded in CSS, and that it is the <DIV> enclosing floated content. Since IE is not fully CSS2 compliant, it ignores the :after psuedo-element, which is fine because IE (incorrectly) encloses the floated elements anyway. Firefox, Opera, and other CSS2 compliant browsers will recognize the :after psuedo-element and expand the <DIV> to enclose the floated element.
Credit for this solution goes to Matt Brubeck, and you can read his article in full by following this link: How to completely enclose a floated element in CSS2 (http://www.cs.hmc.edu/~mbrubeck/clear-after/).
04-29-2006, 05:45 PM
Okay make sure all of your images have widths and heights set to them. Firefox some times needs this to display the page properly. Also this
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
should be this
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
It may throw things off a bit in IE or might not do anything at all to IE but it may make FF better to. After all you should be coding for a good browser (FF) and tweaking for the bad one (IE). overflow:hidden; on the main container also fixes the problem sometimes.
04-29-2006, 11:21 PM
Still doesnt seem to be working properly in FF.
I've been editing here for hours, still cant seem to find a fix.
Here is another link that will not expand out in Firefox:
Click around on the knowledgebase/announcement, etc. links there in the middle. Sometimes it expands out for the content, other times is doesn't and has is "hidden".
Any more ideas?
I really appreciate the help.
04-30-2006, 01:49 AM
The second page doesn't even have a doctype and both have a bazillion html and css errors. Validate and fix those first.
Powered by vBulletin® Version 4.2.2 Copyright © 2016 vBulletin Solutions, Inc. All rights reserved.