Question

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.

Answer 1

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 .