some positioning help needed

[severndigital]

ok .. here is what i have

 

5 divs

 

<div id="logo">
   Logo
</div>

<div id="man1">
   Man 1
</div>

<div id="man2">
   Man 2
</div>

<div id="man3">
   Man 3
</div>

<div id="man4">
   Man 4
</div>

<div id="man5">
   Man 5
</div>

 

my css so far is as follows

#logo{
border: purple 1px solid;
}
#man1 {
border: cyan 1px solid;
width: 25%;
height: 400px;
float: left;
}
#man2 {
border: orange 1px solid;
width: 16%;
height: 400px;
float: left;
margin-top: 100px;
}
#man3 {
border: green 1px solid;
width: 17%;
height: 400px;
float: left;
margin-top: 175px;
}
#man4 {
border: blue 1px solid;
width: 16%;
height: 400px;
float: left;
margin-top: 100px;

}
#man5 {
border: pink 1px solid;
width: 25%;
height: 400px;
float: left;
}

 

the css so far puts the logo div above everything

 

what i want to do is put the logo div in the gap created by man1 and .

Not above everything, but actually between the two divs so that man1, logo, man5 line up at the top with man 2, man 3, man 4 below logo

 

anyone have a solution

 

thanks,

C

 

 

 

 

 

 

 

[TheFilmGod]

Your html markup is incorrect. You also need to clear floats if you want to start a new line.

[severndigital]

That doesn't help me at all.

 

How is my markup wrong??

I did get it working and it had nothing to do with clearing floats

 

 

[dropfaith]

uhm the style sheet you use shows everything floating left?

 

you want from what i see a basic three column layout

 

http://css.maxdesign.com.au/floatutorial/tutorial0901.htm  read up on liguid 3 column layouts using floats and all your answers are solved

[kevin777]

Seems like a strange design, perhaps think up another way to achieve this layout? Otherwise use floats,clear but i doubt it would be very stable with content in it.