Well I hav a problem. I have to build a page that has 5 columns in the footer but I cant seem to succed. The second and fourth column get lowered by firsts and thirds content.

HTML:


<div id="blocks" >
<div id="pair" >
<div id="block1" >One<br/>One<br/></div>
<div id="block2" >Two</div>
</div>

<div id="columns" ></div>
<div id="spair" >
<div id="block3" >Three<br /><br /><br /><br /><br /></div>
<div id="block4" >Four</div>
</div>
<div id="news" >News</div>
</div>
</div>


CSS:

#blocks {
border: 0px;
margin: 0px;
padding: 0px;

}

#pair {
float: left;
width: 350px;
border: 0px;
margin: 0px;
padding: 0px;
}

#block1 {
float: left;
width: 175px;
}

#block2 {
float: right;
height: 132px;
width: 175px;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
}

#colmuns {
float: right;
width: 600px;
}

#spair {
float: left;
width: 350px;
border: 0px;
margin: 0px;
padding: 0px;
}

#block3 {
width: 175px;
border-left: 1px solid #000000;
}

#block4 {
float: right;
height: 132px;
width: 175px;
border-left: 1px solid #000000;
}

#news {
float: right;
width: 275px;
border-left: 1px solid #000000;
}

I played with them floats and I cant make it work...
Im slowly loosing it in my head so if theres some genious here who knows how to make 5 column layout and helps me out Im going to serve him in the afterlife....
I just dont have the nerves to continue but I have to (it would have been much easier with a table I know... But these are clients demands - and I cant say I cant do it... I have to do it... By tommorow preferably...

Anyway thanks go to everyone who at least offer a suggestion. Im in a crisis and everything helps!

Peace!

I hope this sample can help you with your problem

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> FLOAT JUANMANUEL DEMO </title>

<style type="text/css">
#blocks {
border: none;
margin: 0px;
padding: 0px;
}

.col{
float: left;
border: 1px dashed gray;
background-color: #FAFAFA;
color: #006830;
}

/THE SUMATORY OF COL WIDTHS CAN NOT BE OVER THE WIDTH OF THEIR CONTAINING BLOCK/
/IN IE EXPLORE CAN NOT BE OVER 99%/
/WHEN THE WIDTH LIMIT IS PASSED THE LAST FLOAT WILL BE POSITIONED UNDER THE/
/FIRST COLUMN/

#col1{
width: 19%;
}
#col2{
width: 19%;
}
#col3{
width: 19%;
}
#col4{
width: 19%;
}
#col5{
width: 19%;
}

.col .block1{
width: 40%;
float: left;
}

.col .block2{
width: 40%;
float: right;
}
</style>
</head>

<body>


<div id="blocks" >
<div class="col" id="col1">
<div class="block1" >One<br/>One<br/></div>
<div class="block2" >Two</div>
</div>
<div class="col" id="col2">
<div class="block1" >One<br/>One<br/></div>
<div class="block2" >Two</div>
</div>
<div class="col" id="col3">
<div class="block1" >One<br/>One<br/></div>
<div class="block2" >Two</div>
</div>
<div class="col" id="col4">
<div class="block1" >One<br/>One<br/></div>
<div class="block2" >Two</div>
</div>
<div class="col" id="col5">
<div class="block1" >One<br/>One<br/></div>
<div class="block2" >Two</div>
</div>
</div>

</body>
</html>