CSS and positioning

notTHEike

Limp Gawd
Joined
Jun 30, 2003
Messages
285
alright, if i have a <div> (we will call this one 'child') that is located inside another <div> (we will call this one 'parent') and have child's position set to absolute, and is located 10px from the top and 10 px from the left, will the 10 and 10 be from the top of the browser window? or will it be 10 and 10 from parent's location? the reason i ask is because i have a layout with several images positioned absolutely, but i need the whole "layout" image to be placed in the middle of the page...


here is some sample code:

Code:
<div id="parent" style="margin-right:auto;margin-left:auto;">
<div id="child" style="position:absolute; top:10px; left:10px;">
<p>text goes here</p>
</div>
</div>
 
Since the child is inside the parent, it should conform to the boundaries of the parent and not body, html or the whole window.
 
Shadow's right. What you can do is set the parent to
Code:
position: relative
, with
Code:
margin: auto
. and the child to
Code:
position: absolute
and it will offset the child's position based on its nearest encompassing ancestor block (the parent).

Check this page out http://www.stopdesign.com/articles/absolute/ for an explanation.

Hope that helps.
 
Back
Top