I've got a basic layout where the body div is set to a specific width. And with margins left and right are set to auto. Resulting in the div being centered.
Now, when it now comes to positioning all sub elements within this div, is it best to use absolute positioning or fixed coordinates? These sub elements are basically columns of text, some images and a few headings. I've found that floating all of them to the left makes them stack behind each other. Which is basically what I want. But would it be better to specify the coordinates? I ran into a small common margin bug with IE you see. And I know absolute positioning would fix it. But would that be a dirty fix?
I mean, the layout itself is liquid in some sense. But the body div has its width. So the sub elements won't move around regardless of resolution.
As long as you structure your HTML so that the elements follow a logical order that makes sense when rendered without CSS, there is no reason why using absolute positioning should be considered bad practice.
Floats are meant to be used in images that you want the text to wrap around. Position absolute is meant to place elements with some kind of x and y coordinates.
As a special, use “relative” positioning with no displacement (just setting position: relative ) to make an element a frame of reference, so that you can use “absolute” positioning for elements that are inside it (in markup).
IF you were to use all absolute div tags you could easily have your tags overlap and hide each other when the data within them changed. Secondly, many good sites allow for the information to wrap depending on the screen resolution and browser size that a user uses to access the web page.
Note: the margin bug in IE can also be "fixed" by wrapping the div with a margin in a div without a margin, and floating that outer div.
As to absolute vs. float: I suggest you have a look at this page, which seems like a good summary, and ask yourself if any of the cons raise a red flag for you.
I personally would use absolute positioning if all the div's contents are static, and float if some are dynamic. But that's a subjective answer.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With