css layout: margins and padding versus absolute positioning?

Question

I'd like to get some feedback on using padding and margins for page layout versus absolute positioning. I realize that there are and will be scenarious where either or both are preferred and that will depend on the scenario.

But what I'm getting at is overall page layout for pixel perfect designs what is the general rule of thumb? I'm a little more than a year into HTML and CSS and I'm coming from a graphic design background, so most of my train of thought lies heavily on approaching a design from a layout standpoint first. So far in my web designs I have used the rule of thumb to use appropriately titled divs with floats, padding and margins when laying out a page, and if something requires absolute positioning (like an element to be stuck on the edge of the screen or a div) use it when necessary.

But lately I've really been starting to re-think my approach to page layout and wondering if starting with usign absolute positioning as a general rule of thumb is a better idea?

Can somebody point out some good articles or resources on this topic, and I'd love to hear everyone's personal feedback as well.

Answer 1

I've been learning more and more about CSS layout and its quirks over the last 2 years and I am pretty much using the float/margin technique as it seems to give me the best results across different browsers.

Maybe it was just the way I was doing it, but I have experienced some pain with positioning (absolute inside relative containers) when trying to get the same results in all browsers. IE was usually the outlier and that was mostly with IE6/7. I have hesitations with going straight to absolute positioning, but perhaps others here might have had a better experience and can point you in a better direction.

Good luck and I hope you find something that feels comfortable to you!

Answer 2

I can see where you're coming from, but using absolute positioning for your layout is extremely inflexible. I think you'd be best to carry on as you are, using the CSS box model. That's not to say absolute positioning is a bad thing, just that it's not flexible enough to handle fluid layouts, changing box-sizes etc.