1

I am new to designing responsive websites which are done in pure PHP and CSS, and I am not using any CMS like wordpress. I am using @media screen and (max-width:....) for the responsive design only (no Javascript nor anything like it).

My question is when I test the responsive website in mobile google chrome that website does not resize but renders as if it was on a pc screen. If I use the desktop Google Chrome browser and resize the window it works perfectly. Do I need to tell mobile Chrome to resize within my website for it to render the website to that screen size or is that how mobile Chrome works now?

  • What meta viewport tag are you setting? – MrWhite Sep 30 '15 at 22:22
  • If you are using developer tools and clicked the little phone icon to test your mobile site, you will need to refresh the webpage. You can use the icon to the left of the phone icon or just right-click the page area and do a refresh from there. – closetnoc Sep 30 '15 at 23:27
  • This question belongs on Stack Overflow – binaryfunt Oct 1 '15 at 15:34
  • Guys on stack overflow said that this same question belongs on webmasters. I am using Dreamweaver and it renders correctly on the mobile preview. – Paddy Oct 1 '15 at 22:45
  • I am assuming my problem is the viewport tag, I did some research and that was my problem. Thanks @w3d – Paddy Oct 1 '15 at 22:49
1

I did not add any viewports, so I did some research and added this view port <meta name="viewport" content="width=device-width, initial-scale=1">

This sorted my problem. Thanks guys for the help.

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.