So I have an interesting predicament, I' working on a responsive site, and when I resize my browser everything works as it should, but when I view the site from my iphone, it's not grabbing the queries from the appropriate media query, which I have defined as:
@media (max-width: 479px) {
rules
}
The site is ericbrockmanwebsites.com/dev2 Wondering if anyone has come across this before.
Any help is greatly appreciated.
Mobile Media Query Not Working If your queries are working in a browser but not on mobile, you might have forgotten to set the viewport and default zoom. This tells the browser to render pages according to the width of the device. Adding it often does the trick for making mobile breakpoints work.
Media Query Not Working on Mobile Devices If media queries work on desktop and not on mobile devices, then you most likely haven't set the viewport and default zoom. Note: You only need to add one of the code lines above, and usually, the first one does the job.
You'll need to include <meta name="viewport" content="width=device-width, initial-scale=1">
in your head to get your mobile device to respect your media queries.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With