Broswer proofing webpages contents?

[rakoom2002]

I want to make my webpage broswer proof and resolution proof, so that the pages contents stay in the same position and stay the same size propotions no matter which settings or broswer they use. DO you think this would bedone best using css position and sizing? if so how would I go about doing so.

[Wickham]

If you want your page to be the same size in px all the time, use fixed widths and heights, but it will create scrollbars if the viewport resolution isn't big enough or show space all round if the resolution is larger. If you use position: absolute for each div you can position it so that it will always be in the same position from the top left corner, but as I say, in a small resolution you will get scrollbars.

If you want your page to look the same in any viewport resolution, say always having a 50px margin all round top, bottom and sides, then the page itself has to have flexible width and height. You can achieve this by not stating any widths and heights in divs, but the problem is that everything tends to get squashed together in small viewport resolutions or look very spaced out in larger resolutions.

You can avoid some problems by using min-width and max-width but these properties are not operated by IE6. You can also avoid some problems by using overflow: scroll and a height for divs so that they don't get squashed vertically causing the text to overflow outside the div or just get cut off. The flexible method needs a lot of practice and only works well with a very simple page with not much on it.