I am having a little trouble getting my page that has the width 900px look ok on resolutions where the width is lower than 900px. That includes mobile devices such as smartphones. It looks like im zoomed in on the page, but without the ability to scroll around or zoom out. My page wrapper is defined to be centered at the screen. Here is the CSS for the wrapper
#wrapper{
position: absolute;
left: 50%;
margin-left:-450px;
width: 900px;
min-height: 100%;
height: auto;
}
I’d do it like this:
Will also solve your issues on devices other than smartphones.
-edit-
To solve your initial scaling issue, add the <meta> for viewport ( https://developer.mozilla.org/en/Mobile/Viewport_meta_tag ) :