Absolute Position vs Floats
September 12th::2006
CSS gives up two options to position our elements in place of using tables, absolute position and floated elements.
The question is;
Which to use? The answer really depends on what you are trying to do and what you are more comfortable doing. Be that in mind, a lot of this is going to be opinion based :)
When to use Absolute positioning
1. If you have a static width website and you want a 2 or 3 column layout with no footer, then use absolute positioning. Create empty space by using margins, then fill that space with an absolutely positioned element (ie side navigation). I find this gives you greater control over the widths. Plus by using the margin to position the main column (leaving blank space for the side columns) you can create padding without actually using the padding rule (padding: 10px). This eliminates many IE headaches.
Tip: If you want to use absolute positioning within a single element, make sure that the parent element has its position set (usually to relative)
2. Positioning "touch up" images. Things like rounded corners can easily be dropped into the background of a div if you absolutely position them. Some people will argue that rounded corners should go into the css as background images. But untill CSS 3.0 comes out and we can all have multiple background images, neither method is great. And please, don't give me that squid/octopus javascript crap :P
When to use Floats
1. Float when you want text to wrap around an image. Remember to give the image extra margin so it doesnt wrap to tightly though.
2. Use floats if you have a footer. Getting a footer to stay below every absolutely positioned column can be a nightmare, so take my advice and use floats with a footer.
3. Float when you have a liquid layout. If you have a layout that you want to fill the entire screen, I find it easier to float. If you use absolute positions, you are going to be dealing with percentages and I find that a hassle.
I will probably fill this in with some small examples, but for now, learn to use google. There are little thousands of positioning/float tutorials out there. This was meant merely to spark discussion.
