3

I am new to css.

I wanted to know which is the best standard technique to keep the page intact even when the browser size changes, the page is zoomed in or is used for any other screen size. I have tried centering my layout using a container but it gets disturbed when the page zooms in (i know it will, but all what I want is that the elements don't go out of the screen and if possible stay in almost the same position).

So what is the best and easy standard technique in css to achieve the

Thanks for your help.

user591124
  • 495
  • 2
  • 9
  • 23

2 Answers2

5

The newest, cutting-edge method is called responsive web design. It's a bit complicated, but it's looking like the way to develop for multiple screen sizes. It is especially useful for small websites.

Check out some examples here: http://mediaqueri.es/

And some more in-depth information here: http://www.alistapart.com/articles/responsive-web-design/

Jimmy
  • 637
  • 5
  • 13
3

If you set a set size for your body element anytime the browser is re-sized nothing within the page will change.

So the CSS you want to add is as follows:

body {
    width: 960px; //being the size screen you want to accommodate your site to
}

Also this may help you: Commonly used pixel sizes for webpages and their pros/cons .

Community
  • 1
  • 1
Nachshon Schwartz
  • 15,289
  • 20
  • 59
  • 98
  • I don't really understand what you mean, can you post an example in http://jsfiddle.net/ ? and maybe try to better explain your problem... – Nachshon Schwartz Aug 23 '11 at 08:52