Jump to content

'stretching' nested divs?


rawb

Recommended Posts

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?

Link to comment
Share on other sites

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.

Link to comment
Share on other sites

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>

Link to comment
Share on other sites

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

 

 

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.