How to align elements on the inside edge of a <div> tag?

Question

How do I align an element on the inside edge of a tag? That is, so that it works like absolute positioning but only inside the tag. I think a way it would work is if it were possible to force the element to think the tag was the actual page, but I don't know if this is possible/ideal.

EDIT: http://www.flickr.com/photos/chustar/3736370208/ here's a mockup of what i mean

Answer 1

What you need to do here is make the container element position:relative; and then make the "positioned" elements position:absolute;

.container {
  position:relative;
}

.child1 {
  position:absolute;
  top:0;
  left:0;
}

.child2 {
  position:absolute;
  bottom:0;
  right:0;
}

<div class="container">
  <div class="child1">Top left element</div>
  <div class="child2">Bottom right element</div>
</div>

Answer 2

When you set the container element (a <div> for example) to "position: relative", and you set the inner element to "position: absolute", the inner element is positioned relative to the outer one, not the page.