Absolute Positioning
After using floats, you'll think absolute positioning is much more exact, and it is. You can achieve near pixel-perfect positioning of all of your page elements. Why would anyone use floats when absolute positioning is available? There are some good reasons and situations where different positioning methods just make more sense. We'll cover this subject in the "Positioning Wrap-up" lesson at the end of this tutorial.
Let's start with an empty browser window again:
Now let's place a div using exact positioning within our mock browser window, using this div:
<div style="positioning:absolute; left:0px; width:60px; height:60px; background-color:red">
Just kidding! This was just to point out that with absolute positioning, "left:0px" means display the element at the very most left pixel on the side of the browser window. Because the black frame is really in the middle of the browser window, and x2tutorials.com doesn't use absolute positioning, it is hard to place the red box at the exact position using absolute positioning.
We will fudge it and pretend that we used "position:absolute; left:0px; top:0px;" for the positioning of this div. So it would look like this:
The way the element was positioned here was, in reality, using "position:relative", but that is the subject of the next lesson (coming soon). Using absolute positioning is only reasonable when you use a fixed size site that is also fixed within the browser window.