CODEWITHSUNDEEP
css
user1207524
user1207524

Reputation: 369

Absolute positioning within div

Im making my website and I am wondering if its possible to make something like this:

My HTML looks like this:

<div id="box1"><div class="box2"></div></div>

CSS:

#box1{width:300px; height:100px; position:relative; background:#ccc;}
#box1 .box2{width:100px; height:100px; position:absolute; top:20px; background:#999;}

I would like the .box2 to be positioned 20px from top of #box1, however this way it is 20px from top of page. Any help how to solve this please?

Thanks

Upvotes: 0

Views: 63

Answers (1)

Ruan Mendes
Ruan Mendes

Reputation: 92324

Your code is working correctly. The div is at the top of the page, so the inner div is 20px from both the outer div and the top of the page. See my example http://jsfiddle.net/unD7H/

Upvotes: 2

Related Questions