Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Chris Rowley
752 PointsHow to make a website - responsive
I followed the track How to make a website but once my website was live Iphone 5 is showing the three column layout rather than the two column layout
8 Answers
Andrew McCormick
17,730 Pointsyour viewport tag isn't formatted correctly. On your page you have <meta name="viewport" content="width=device-width," initial-scale="1.0," user-scalable="no""/>
the width, initial-scale, and user-scalable should all be inside one set of double quotes separated by a comma.
Example: <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/>
Sean Whitmore
5,035 PointsAn iphone5 screen resolution is 640 by 1136 so if you increased your media query by 40 PX it should work. Also your site looks really nice!
Andrew McCormick
17,730 PointsDo you have the meta tag for viewport set? for example <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
make sure to watch: http://teamtreehouse.com/library/build-a-responsive-website/adaptive-design/viewports
Sean Whitmore
5,035 PointsCan you post a link to your website?
Chris Rowley
752 PointsHi Sean
Website is http://mothersdayemmarowley.biz/
its a bit of a hybrid between the lesson and my own styling changes so please ignore some of the styling as its not great or finished !
Thanks for responding
Unsubscribed User
6,508 PointsIt might have to do with the idea that the resolution is lower than the pixel count. There is something about this in the CSS deepdive, but basically it is that your phone displays two pixels (for example) as one on the physical phone.
Don't know if this is right or not, but try to increase your media queries to something like 1000px and see if it still doesn't respond the way you want.
Chris Rowley
752 Pointsthanks for all your help, i'm still struggling. I added the viewport tag and no change and I tried experimenting with the media query pixel limits and again no change.
Chris Rowley
752 PointsThanks Andrew, it is now working to a point, need to look at the styling as it has done some strange things in comparison to how the most scaled down desktop window displays.
Thanks again