iPhone zoom problem with media queries

[maxoys45]

Hello,

New to these forums so sorry if this has been asked before! (Been following the site for a while though)

Currently testing out these media queries to adjust a page depending on screen size. Not had any problems when it comes to browser size but on my iPhone (4s) – the page displays the correct style, but seems very zoomed out and i’m not sure how to change this.

Here’s a link to the site in question: http://www.maxhenchman.co.uk/resize_test/

And here’s the code im using to target the phone:

@media

only screen and (-webkit-min-device-pixel-ratio : 1.5),

only screen and (min-device-pixel-ratio : 1.5) {

I’ve been looking through the css files on here because it displays properly but can’t find the answer! Any help is much appreciated :)

Cheers,

Max

[maxoys45]

sorry to be one of those idiots that finds an answer just after posting but…

i found an article about it and added this to the HTML:

This has fixed the problem but i’m curious if this will affect anything in the browser?

Also, i’d ideally like to be able to achieve this through css only – without touching the HTML, possible?

[maxoys45]

Ok then,

Thanks for the tip!

[Author]

Posts