How to fit the website width to the screen width without stretching width

[Moderns]

Hi,

I need to fit the website width to the screen width and when I zoom out the browser, I don't want the website width to stretch on left and right. I am using the Javascript now to assign the website width the value of window.screen.width, but I faced problem with IE7 and IE8 that when I zoom out or zoom in the window, then the value of window.screen.width will change.

I am looking to make something like this website: http://ca.com please try to zoom out and see the website will not stretch on left and right.

Would appreciate your kind hints.

Note: I don't want to use the Jquery or any library, just pure Javascript or CSS.

Thanks.

Cheers!

[webmeat]

I'm not 100% sure I understand your question, but I believe you're saying you want a static width on various view sizes. You could just set the width inside a media query. For example:

@media only screen and (min-width: 320px) {
    .container {
        width: 300px;
    }
}

@media only screen and (min-width: 480px) {
    .container {
        width: 460px;
    }
}

Since I don't have your code, this is a generic example.