Absolute positioning within another container

Say you want to position something within its container, then the element you are trying to position needs to have:

position: absolute;

But the parent container can simply have:

position: relative;

So in full:

<div class="container">
    <div class="abs-position">
        Hello world!
    </div>
</div>

And then simple CSS:

.container {
    position: relative;
}

.abs-position {
    position: absolute;
    left: 100px;
    height: 200px;
}

Easy solution to an age old problem.

Leave a Reply

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

This site uses Akismet to reduce spam. Learn how your comment data is processed.