[RESOLVED] css float

[pwydra]

Hey,

I want to get the div "menu2" to be underneath menu and "content" to float to the left of "menu", not "menu2". How can I do this? Thanks!

/* CSS Document */

body
{
font-family:Geneva, Arial, Helvetica, sans-serif;
background-color:#C8C8C8;
color:#3333CC;
}

#frame
{
width:800px;
background-color:#FFFFFF;
margin-left:auto;
margin-right:auto;
}

#header
{
width:auto;
height:70px;
}

#menu
{
width:200px;
height:auto;
margin-top:10px;
float:left;
}

#menu2
{
width:200px;
height:auto;
margin-top:5px;
clear:left;
float:left;
}

#content
{
width:600px;
height:auto;
margin-top:10px;
float:left;
}

#footer
{
width:800px;
height:20px;
clear:left;
}

[pwydra]

it works the way I want it to in IE, but not in FF. So...I'm missing some code somewhere...

[Pegasus]

It depends on how you've got it listed in the HTML. One way to do it would be to have the menus enclosed in another div and that containing div is floated left with the content div also being display: inline;

I'm not sure if adding display: inline; to the content would move it over, but you might try that.

Peg

[petervazed]

You need a clear:both
option, google around to find a how-to
link:
http://www.google.nl/search?q=clear+both+css+how-to&sourceid=navclient-ff&ie=UTF-8&rlz=1B3GGGL_nlNL238NL238&aq=t

:cool:

[pwydra]

Thanks, that did it!