Question

I’m not really sure how to explain this so here is a picture:
Window To Small http://vsave.org/my/user_folders/Ian33_159/image.jpg

As you can see in the picture, as the screen shrinks, the picture moves out of view because I use the code:

    position: absolute;
    left: 50%;
    margin-left: -450px;
    width: 900px;

since it is subtracting 450px it moves into the left of your screen where you can’t see it anymore.

Here is the code for my body tag:

    body {
margin: 0px;
padding: 0px;
min-width:1000px; /* suppose you want minimun width of 1000px */
width: auto !important;  /* Firefox will set width as auto */
width:1000px;             /* As IE ignores !important it will set width as 1000px;*/
    }

If you need more information just let me know.
Thanks

Answer 1

Set a min-width on the parent element (or body) and that will make it so that the window will have horizontal scroll instead of running off the page.

Note that min-width is IE 7+