basic css question

suki · 19 Jan 2006 at 20:11

i'm finding it hard to understand how to position divs where i want them using css on my page.

1. can someone explain why you couldnt just position divs using abs all of the page ??

2. if 1 is not right, then how should you do it ? placing on div using abs. then use rel to position the rest ??

and alsoo

can u explain why on http://suki.vidahost.com/home.html . when the window is small smaller the divs bunch up. but on http://suki.vidahost.com/div.html . they dont . even thought i use the same way of positioning

thank you for help

growse · 20 Jan 2006 at 09:47

Absolute positioning is bad, because it offers no flexibility to those people who have a different resolution / text size to you.

The best way to position divs is just to specify their margins, and let them just flow down the page. Just look at websites on the internet if you want to see how it's done.

Augmented · 20 Jan 2006 at 10:53

growse said:
Absolute positioning is bad, because it offers no flexibility to those people who have a different resolution / text size to you.

Sorry, but that's rubbish. Absolute positioning presents neither of those problems:

Not affected by resolution - an absolutely positioned element is relative to the edges of the nearest positioned ancestor. Block-level elements don't have 'position' by default, and the typical nearest positioned ancestor is the edge of the browser window (<body>/<html>), meaning that the element will move with the edge of the window. That's why you get unexpected problems at different resolutions.

So, in order to have an abs-elements position as you would expect, you must ensure its containing element has 'position' (e.g. by giving is a position: relative; property).
Not affected by text size - you can absolutely position elements using % or ems, which will reposition the element according to text size/proportional to the layout.

Absolute positioning is good

, but it needs to be used in combination with relative positioning and floats for truly flexible layouts (not necessarily all at once!).

For the OP;
Absolute positioning: http://www.stopdesign.com/articles/absolute/ and http://www.wpdfd.com/editorial/wpd0904news.htm#feature
Float Layouts: http://css.maxdesign.com.au/floatutorial/index.htm

iCraig · 20 Jan 2006 at 15:21

I tend to end up with "DIV soup" when using absolutely positioned DIVs, having to provide relative containers for my absolutely positioned elements.

I find it much easier to use float, margins, and clear properties to organise my DIVs mainly.

And tweaking the positions with, other display properties, block for example.

suki · 20 Jan 2006 at 17:43

is using margin settings a good way to position things. ie. left-margin 10% etc. are there many problems positioning elements like this ?? along with relative pos?.

also what is float positioning

cheers