CSS Help

Decker

08-25-2010, 04:03 PM

Alright im just learning CSS. But How can I place things under each other? Like say I want to FIRST put 2 left boxes, then the content, how would i come about doing that? I have only made it far enough to put 1 left box and content, i dont know how to put 2 left boxes, if i put 2 left boxes, it turns out right to the side of it instead of under it. Any help will be appreciated.

dome90uk

08-25-2010, 04:35 PM

Hi,

Sounds like you need to clear the float. Try the code below after your first floating div.

<br style="clear:left" />

Decker

08-25-2010, 06:39 PM

Alright anyone. I did what ^ said, and it worked. But when I put the content bar, it don't go beside the FIRST left nav like i want it to, this is what it does:

http://img810.imageshack.us/img810/6121/61274952.jpg

how do i make it on the right of it?

index.html
<html>
<head>
<title>Website</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>

<div id="container">

<div id="header"> </div>

<div id="leftnavtop"> </div>

<br style="clear:left" />

<div id="leftnavbot"> </div>

<div id="content"> </div>

</div>

</body>
</html>

style.css
body {
background-color: #383838;
font-family: Comic Sans;
}

#container {
width: 700px;
padding: 1px;
margin:43px auto 0;
}

#header {
width: 700px;
height: 100px;
background-image:url(images/2.jpg);
}

#leftnavtop {
width: 160px;
height: 170px;
background-image:url(images/1.jpg);
float: left;
}

#leftnavbot {
width: 160px;
height: 170px;
background-image:url(images/1.jpg);
float: left;
}

#content {
width: 500px;
height: 350px;
background-image:url(images/3.jpg);
}

skywalker2208

08-25-2010, 08:18 PM

Have you even tried doing things by trial and error? Try something and if it doesn't work then try something else. It is a good way to learn.