rawb Posted July 4, 2007 Share Posted July 4, 2007 This is probably really dumb and easy but here goes. Basically, I have a bunch of floated divs inside of a container div. In IE it looks fine, but in firefox the container div doesn't stretch to contain the floated divs.. it simply appears as though there is no content in it. For a visual, check this link in both browsers: http://www.rawbk.com/tournament/displaytourney.php?id=12 . Could anyone possibly explain why mozilla does this and how I can fix it? Quote Link to comment https://forums.phpfreaks.com/topic/58402-stretching-nested-divs/ Share on other sites More sharing options...
soycharliente Posted July 7, 2007 Share Posted July 7, 2007 What exactly on that page is being pushed down that you don't want to be pushed down. I only have access to FF on this computer. Supply some code as well. It's hard to fix what's wrong if we don't know what you did that's making it not appear how you want. Quote Link to comment https://forums.phpfreaks.com/topic/58402-stretching-nested-divs/#findComment-291924 Share on other sites More sharing options...
dbrimlow Posted July 12, 2007 Share Posted July 12, 2007 WHOA! That's actually gotta be the worst markup I've ever seen. Not only is there no doctype, but you don't even have an html declaration or head tags. It's WHAMMO! right into the body (oh, with a link to the css thrown in where the missing head tags aren't). This will never work. It doesn't have a proper web page structure in any sense. A web page should have the following minimalist structure: <html> <head> <title></title> </head> <body> </body> </html> And even THEN it would still be in "quriks mode without a proper doctype, and therefore no css will work in proper browsers like FF and Safari. I would recommend sticking with the least restrictive. So your minimalist markup would be: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title></title> </head> <body> </body> </html> Quote Link to comment https://forums.phpfreaks.com/topic/58402-stretching-nested-divs/#findComment-296009 Share on other sites More sharing options...
ToonMariner Posted July 13, 2007 Share Posted July 13, 2007 without seeing the 'worst' markup ever seen.. afterall yourfloated divs but inside the containing div place something like <div class="clear"></div> andin your css put div.clear { clear: both; } Quote Link to comment https://forums.phpfreaks.com/topic/58402-stretching-nested-divs/#findComment-296878 Share on other sites More sharing options...
dbrimlow Posted July 16, 2007 Share Posted July 16, 2007 It still will not work. TM, take a look at the markup! When a web page is in quirks mode (no doctype) you cannot be sure any css element will work properly in any real browser but IE - although the real browsers will attempt to assume a doctype and depending upon the complexity of the element in question, may display them ... relatively some of the time. As it is, even when the page is 100% valid markup we more often than not still have to either have a hack, conditional expression or separate css to make IE behave. So, when you don't even have the <html></html> elements in the markup, the page is beyond just quirks mode and more in the realm of broken html. Whether CSS elements will work in this case is a crap shoot. Here is how the page starts: <LINK href="inc/style.css" rel="stylesheet" type="text/css"> <body> <div id=banner><img src=images/banner.gif></div> <div id=leftnav> <div class=leftmenu> <div class=leftheader>Menu</div> Here is how it ends: </body> First, fix your markup to be non-broken html. Than add a proper doctype. (again, I recommend you use <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">). Once you have the markup coded properly, see if your initial css works before trying any fixes. The css may not be broken ... the floats aren't working in real browsers because the markup document is broken. Good luck. Dave Quote Link to comment https://forums.phpfreaks.com/topic/58402-stretching-nested-divs/#findComment-299709 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.