If you’re using the Firefox inspect element tool you’re seeing the desktop style.css which has no relevance to the mobile css. Unless you are on a mobile device or using the Chrome Dev Tools mobile emulator you won’t see the mobile css. This is because I’m using the Mobile CSS plugin. I’d suggest the Chrome Dev Tools mobile emulator.
The
‘@media (min-width:820px) {‘
Doesn’t apply to mobile formatting, only when the window is shrunk on desktop. I just commented it out right now and deleted the max-width on top so it didn’t confuse anyone.
The mobile formatting is done by the CSS Mobile Plugin which for some reason only formats down to 980px. I just need to figure out how to change or get rid of the 980px constraint.
Here’s the css that runs the mobile site:
http://duenorthsports.com/wp-content/uploads/2015/06/MobileCSS.txt
