treehouse : what would you like to learn today?
Web Design Web Development iOS Development

[Solved] Responsive on mobile

  • Hello World, first time poster!

    I am currently building a responsive site, I have been testing the responsivness by resizing the browser and occasionally checking mobile emulating websites. I have just uploaded my site onto the web for testing purposes to find it does not work on my iphone, even though it displays properly on iPhone 5 emulators. I have no idea why it would work on the browser resize and on emulators and not on the actual device!

    An example media query of mine would be "@media all and (max-width: 880px)"

    Here is my test site http://rapidadventure.co.uk/site/index.php

  • @Boggon, have you added the viewport meta?

    < meta name="viewport" content="width=device-width, initial-scale=1">
    
  • Thank you so much! Worked perfectly

  • You can't trust those online emulators, they usually just use an iframe that happens to be the same height and width of the device. (which is nothing like how the device actually renders the page)

  • Cheers for the warning, I might just walk into a computer shop and discreetly check my site on as many computers and devices as possible :|