Welcome to the Treehouse Community
Looking to learn something new?
Kevin Enloe12,438 Points
Media Query not working
I have a site I am building using the mobile first train of thought. I have finished all of the mobile CSS and have added some desktop CSS in a media query that is set to break at 985px. This is one of my problems; I originally had it set to break at 800px and when I tested it on my phone (IPhone 5S) the site was pulling up with the desktop version. I found the break point for it to not show the desktop (980px) by just changing it until it loaded correctly. Now that I have the break point fixed it is bugging me that everything is so small just like if I was looking at a non-responsive site. I have used % for all widths until the desktop CSS is brought in (which is not when looking at it on mobile) and it seems like the phone is opening the site as if it has a resolution of 980px, but it shouldn't and it should be around 400ish. I have no idea what is happening and would love help with figuring this out.
The site in question is www.helpmetietheknot.com which is to invite/announce my half of my wedding party once I finish it.
Sebastian Mercado8,800 Points
Did you remember to put the meta tag for viewport in the head of all your pages?
<meta name="viewport" content="width=device-width, initial-scale=1.0">