Placing child element relative to parent with div

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

Rob T. - 27 Jul 2005 20:02 GMT

Given the following in a stylesheet:

#parent
{
width: 50px;
height: 50px;
}

#child
{
width: 50px;
height: 20px;
}

<div id="parent">
<div id="child"></div>
</div>

Now, is there any way to make the bottom of the child element be right
on the bottom of the parent element? I need this to be done without
using position relative/absolute and just having top be 30px because
the parent element height is going to be dynamic. Any help
appreciated.

Rob

Reply to this Message

David Dorward - 27 Jul 2005 21:44 GMT

> Now, is there any way to make the bottom of the child element be right
> on the bottom of the parent element?

#parent
{
width: 50px;
height: 50px;
position: relative;
}

#child
{
width: 50px;
height: 20px;
position: absolute;
bottom: 0;
}

> I need this to be done without using position relative/absolute and just
> having top be 30px because the parent element height is going to be
> dynamic.

I don't see how you could make that limitation based on that reason. I
think, perhaps, you don't understand how positioning works properly. As far
as I can tell, it is exactly what you are after.

Signature

David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
Home is where the ~/.bashrc is

Reply to this Message

Rob T. - 28 Jul 2005 03:59 GMT

>> Now, is there any way to make the bottom of the child element be right
>> on the bottom of the parent element?
[quoted text clipped - 21 lines]
>think, perhaps, you don't understand how positioning works properly. As far
>as I can tell, it is exactly what you are after.

You are right David. I didn't properly consider using
relative/absolute position. Thank you for the help.

Rob

Reply to this Message

Webmaster Forum / HTML, CSS, Scripts / CSS / July 2005

Placing child element relative to parent with div