Menu
I had a discussion with someone about absolute positioning. He claims that the best practice to secure that everything looks all the same across most browsers and that it's the easiest way to maintain the looks and feel that you intended for a website.
I disagreed with his opinion, that absolute positioning would be the remedy and an overall best approach to laying out a webpage.
In my case, I've been more keen on using the approach of margin/width/careful floating adjustments, and sometimes the occasional table. Which is a slight generalization, as of course, I wouldn't stop using absolute positioning just because I'd be ideologically against it, it's just that I find the approach absolute-position one rule fits all-approach as advocated by my peer to be rather doubtful.
What's the general consensus about this?
825
Absolute positioning defines the position of a given bounding box from the top and left side margins of the web page. This not only allows objects to be placed in an exact location, it also allows objects to be placed one on top of another.
Absolutely positioned elements are positioned with respect to a containing block, which is the nearest postioned ancestor. If there is no positioned ancestor, the viewport will be the containing block. Elements with fixed positioning are fixed with respect to the viewport—the viewport is always their containing block.
An absolutely positioned element is an element whose computed position value is absolute or fixed . The top , right , bottom , and left properties specify offsets from the edges of the element's containing block. (The containing block is the ancestor relative to which the element is positioned.)
position: relative places an element relative to its current position without changing the layout around it, whereas position: absolute places an element relative to its parent's position and changing the layout around it.
The internet isn't print, I don't think it's ideal to absolutely position everything. I'd argue you can make sure things look better by using your method, perhaps augmented by using EMs for some widths to allow the page to be a bit more fluid on different screen sizes (and DPIs). This allows your content to scale better, and with mobile browsing becoming more popular that's important.
In my experience pages tend to look better overall when you plan for your page to have to adapt a bit to different devices, as opposed to trying to force 100% pixel-perfect layouts like you'd see in print. That's just not the nature of the internet.
Edit: Thinking about it more, using all absolutes might really come back to bite you with mobile browsers if you're not careful. What happens when your site uses absolute positioning on something like the iPhone (assuming you're aligning some elements to corners)? The positioning would be aligned to the iPhone's corners, which are an odd ratio (compared to computers) and much smaller resolution; throwing everything out of wack. If you used a combination of floats/widths/etc you'd make sure the site kept its original size and you'd just have to scroll.
126
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
