View Full Version : Float Drop/Expanded Box Problem

03-18-2009, 02:22 PM
I'm relatively new to Dreamweaver and web design altogether and I'm experiencing what appears to be the Float Drop or Expanding Box problem. I've read a lot about it and tried all of the solutions I've found for it but I can't seem to figure out what's causing the problem. I've made sure nothing is too large to fit inside the div, I've tried using an overflow, and I've tried not setting a set width to my div and still the problem persists (this is in Internet Explorer only by the way). I'd really appreciate any advice!!

You can see what I'm talking about here:


03-18-2009, 04:55 PM
Hi kryssie, welcome to the forum.

Checked the page in FF3 and IE7 both appear the same. You do have a slight horizontal scroll issue.

Which div is giving you the problem?

03-18-2009, 05:13 PM
Thanks for your prompt reply! After you mentioned you looked in IE 7 I checked which version I've been viewing it in and it's IE 6. I believe the problem is only occurring in version 6. The problem div is the one with the main content in it (it includes the heading, body copy and the thumbnail buttons).

03-18-2009, 05:29 PM
Without taking the code and css and playing around with it in my editor.
Take a look at your h1 tag inside the header you have some images stacked up that could be the problem.

<h1><a href="hometest.html"><img src="Images/1.jpg" width="171" height="111" border="0" /></a><img src="Images/11.jpg" width="601" height="111" border="0" /><img src="Images/header_3.jpg" width="115" height="111" /><a href="contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('contact','','Images/header_5_over.jpg',1)"><img src="Images/header_5.jpg" name="contact" width="135" height="16" border="0" id="contact" /></a></h1>

03-18-2009, 05:36 PM
Would stacked images in my header cause the main content div to drop? It's a completely different div.

And what's weirder is that the homepage (www.gabor.net/test.html) is fine, but it's a 3-column layout.

03-18-2009, 05:37 PM
Ooops, I meant www.gabor.net/hometest.html and also www.gabor.net/contact.html. They are both 3-column layouts.

03-18-2009, 05:57 PM
Looking at the code for the two pages, the first thing I noticed is that you have a div id="body" in the advertising page and not in the hometest page.

03-18-2009, 06:37 PM
Ooops, I meant www.gabor.net/hometest.html and also www.gabor.net/contact.html. They are both 3-column layouts.

Hi Kryssie. It's not very often I look at sites from threads on here and I feel I want to comment on them...but I really like your design. :-D

03-18-2009, 06:56 PM
Thanks Corrosive! I'm a graphic designer trained in print design and very new to designing for web so I really appreciate that.

03-18-2009, 07:37 PM
What do you mean by float drop?

If you mean the surrounding container is not stretching to fit the floated elements inside use

overflow: auto;

on your containing element to force it to stretch.

03-18-2009, 07:54 PM
Well, that's just it. In all the articles I read about this problem they say that there's usually something inside the div that's larger than the div itself and causing it to push down. However, nothing inside my div is wider than it so I don't know what's causing it.

03-18-2009, 07:58 PM
Oh, and I should say that the particular div I'm having problems with isn't even really floating. Only the navigation bar on the left is floating to the left.

I don't fully understand how that div is sitting on the right because I'm pretty new at this. I just started with a two-column template in Dreamweaver.

03-19-2009, 01:09 AM
post your code