Another IE Div Alignment Problem

PixelPusher · 10-06-2010, 04:30 PM

The reason why one div is wrapping is because there is not enough allowed space in the first row. This is exactly how floats are supposed to function. All you need to do is figure out the math. I tend to use multiples of 5 just because its easier. So...my suggestion:

Set the main container width to "960px" (not 958px)
960 is easily divided into 3.
Change the margin to "5px"
Change the padding to "5px"
Set the width of each column to "300px"
Now they all fit. (checked in IE7)

Determining Width
Main container = 960px;
960/3 = 320;
320 - 10 (L & R margins) = 310;
310 - 10 (L & R padding) = 300

If you still need help, don't hesitate to ask.

10-06-2010, 04:30 PM	#11
PixelPusher Super Moderator Join Date: Oct 2008 Location: Arizona, USA Posts: 1,053	The reason why one div is wrapping is because there is not enough allowed space in the first row. This is exactly how floats are supposed to function. All you need to do is figure out the math. I tend to use multiples of 5 just because its easier. So...my suggestion: Set the main container width to "960px" (not 958px) 960 is easily divided into 3. Change the margin to "5px" Change the padding to "5px" Set the width of each column to "300px" Now they all fit. (checked in IE7) Determining Width Main container = 960px; 960/3 = 320; 320 - 10 (L & R margins) = 310; 310 - 10 (L & R padding) = 300 If you still need help, don't hesitate to ask. __________________ John Darling Graphic / Web Designer SmarterTools Inc. (877) 357-6278 www.smartertools.com

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode