CODEWITHSUNDEEP
htmlcss
Alegro
Alegro

Reputation: 7956

How to top align two divs inside a third one?

I need left div as menu and right as content.
I'm trying to adopt the accepted answer from this post:
CSS: how to get two floating divs inside another div 

#container {width:900px;}
#left {
    width: 150px;
    float: left;
}
#right {
    width: 500px;    
    margin-left: 170px;
}
.clearBoth{clear:both;}

HTML

<div id="container">
<div id="left">leftMenu</div>
<div id="right">rightContent</div>
<div class="clearBoth"></div>
</div>

left and #right should be top aligned but #right is bellow #left.

Upvotes: 1

Views: 1022

Answers (2)

Pramod Kumar Sharma
Pramod Kumar Sharma

Reputation: 8012

Try this one

#container {width:900px;}
#left {
    width: 500px;
    float: left;
}
#right {
    width: 500px;    

float: left;

}
.clearBoth{clear:both;}    

<div id="container">
<div id="left">leftMenu</div>
<div class="clearBoth"></div>
<div id="right">rightContent</div>

</div>

Upvotes: 1

Bart Kuijer
Bart Kuijer

Reputation: 381

Have you tried giving the right div a float too?

#right {
width: 500px;    
margin-left: 170px;
float: left;
}

a jsfiddle to show you it works :)

http://jsfiddle.net/LtUzc/

Upvotes: 2

Related Questions