How to avoid adapting to zooming in responsive design? -
i’m not english speaker , try explain problem in better way can.
i’m designing first responsive website using css. until things going slow fine.
my first test page responding correctly in widths of desktop browsers, including narrowing them until smaller width. after tests loaded page in nokia 5800 smartphone uses symbian.
my main problem following:
the test page loaded correctly in nokia 5800 smartphone , when rotate phone, page adapts internal elements new width.
it ok, but… when zoom page (double clicking on screen), page zoomed , browser narrows again internal elements new more narrow width , dont want page responsive in zoom (for example: when page loaded @ 320px width resolution) want elements zoomed when zoom page. explaining correctly? page appears responsive!!!!! :) or thing not working fine.
in other words…. page adapts divs (etc) @ more narrow width on desktop browsers, problem when zoom in smaller screens (smartphone), because elements additionally narrowed , .
i used several variations of tag:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
... kind of smartphone stills adapting widths when zooming page. thing not working.
i limited body zoom: 1
in css body width set in 100% resolutions.
i need when zooming (scaling) page, these widths dont modified.
before destroying smartphone :) ask…
is there way in css avoid responsive effect when zoom?
i don't know more can do.
i hope have explained issue can me.
these main parts of csss
in main css:
body { /*background-color: white;*/ background-image: url('images/background_pages_gris-ruido.jpg'); line-height: normal; color: black; z-index: 1; width: 100%; zoom: 1; display: block; }
in media css:
@media screen , (min-width: 961px) , (max-width: 1152px){ body { background-color: transparent; line-height: normal; } #div_global { width: auto;/*950px;*/; display: table; float: none; background-color: transparent; margin: 0px auto 20px auto; }
now revised test page using ipad , samsung galaxy s3 smartphone. in these devices page can not zoomed.
the problem smartphones nokia 5800. there way avoid responsive effect when zoom?
i hope these data can enough analize. thank you! gussiglo21
Comments
Post a Comment