Dave Pierce wrote: > Marty said: > > >> I've done this before but for whatever reason it ain't working now :) >> >> I'm trying to float one div up next to the other. >> >> You can see the code here-- http://www.mearis.com/ >> >> It looks like it should in FF but in IE6 div#right is wrapping beneath >> div#left... >> >> >> The CSS looks like this-- >> >> div#container { >> width: 760px; >> height: 100%; >> margin: 0 auto; >> background-color: transparent; >> } >> >> div#left { >> float: left; >> width: 215px; >> } >> >> div#right { >> width: 545px; >> padding: 10px; >> float: left; >> } > > Marty, I think I know this one! IE adds an extra 3 pixels between your > floats.
Actually, IE only does this if one is floated and the other is not. In this case, both are floated, so that's not the problem in this case. Here, it is a box model misunderstanding. You have forgotten to take the padding on the second div into account. The total space the two divs will take up is 215 + 545 + 10 + 10 = 780. Change the container's width to 780px. > You may want to change your width measurements. IE, make the > div#container 760 ems, and change the left and right divs to > percentages. That way they'll be more fluid, and allow for expansion. > I doubt Marty wants a container that is 760ems wide! :-) Probably something more like 45 to 50 ems would be appropriate. Also, I wouldn't mix percentages with ems here. Setting the divs inside to ems as well is probably safer. Zoe -- Zoe M. Gillenwater Design Services Manager UNC Highway Safety Research Center http://www.hsrc.unc.edu ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
