CSS grid: putting a period in front of grid-container class breaks media query
This issue is driving me crazy and Google has not produced any results.
I have a basic local site (HTML & CSS have both been validated with no issues). I made a CSS grid for it. Works fine.
When I built the media query, the media query refused to work when screen was resized.
I looked at some other examples online and noticed some people don't put a period in front of their grid-container class in CSS OR in the media query, whereas most people do.
I removed the periods in front of the grid-container class and in the media query, and now it works.
Media Queries for device screen resolution and not browser window resolution?
On my site I have a site-wide media query file named media.css which contains this code:
/* w1920px */ @import url("global.css") only screen and (min-width:1601px); /* w1600px */ @import url("global_w1600px.css") only screen and (min-width:1361px) and (max-width:1600px); /* w1360px */ @import url("global_w1360px.css") only screen and (max-width:1360px);