[RESOLVED] Responsive not working in smart phone

[lprintz]

My first responsive project and it's not as smooth as I hoped!

I've completed an initial concept with break points at 768 and 480 and it breaks fine when I resize in the browser. I did a final test in my smart phone and I get the FULL SITE!

I've been banging my head against the wall and I sure hope somebody can bail me out!

You can see the page here - www.siphon-marketing.com/unifirst

Also, when resizing my screen on a desktop, it breaks OK but I need to refresh at each point to force some elements in place...any way I can prevent that?

Thanks so much!

[rtrethewey]

You have two 'viewport' <meta> tags, and I suspect that the second one is overriding the first on smartphones, leading to a fixed width.

[holyhttp]

1) What is the resolution of your smartphone?
For instance most smartphones have a screen width of more than 484px in portrait mode.

2) If you need to refresh to force some elements in place, it means the corresponding CSS are missing in the media query corresponding to that "max-width"

[lprintz]

You have two 'viewport' <meta> tags, and I suspect that the second one is overriding the first on smartphones, leading to a fixed width.

This was the culprit! Works fine now and I increased the width for it to work in my smart phone.

Thanks all!

Len

[bungperson]

fisrtly you must be know which your size phone

I-phone Potrait = 320 x 480
I-phone Landscape = 480 x 320
I-pad Potrait = 768 x 1024
I-pad Landscape : 1024 x 768

and now, which you size of your smartphone ?