Question

Absolute positioning is great, but it seems to position it relative to the browser window. This doesn’t work for me because the content of my page is centered. I trying to build a structure similar to Allegorithmic. Notice as the bottom left of the page there is a grey bar with a section entitled “About”, then to the right of that “Quick Links” and “Stay Connected”. So if I have that grey bar section centered in the page – how do I position those three sections as they are? (one to the right of the other). Again, all I can think to do is absolute position them where I want them to be, but isn’t there a way of “absolute” positioning things within their respective div tags instead of the main window?

Answer 1

Make sure to position your container relatively.

This will ensure that absolutely positioned items are relative to your container.

#container{
  position:relative;
}

Working example