Css Media Queries Min-width/max-width Not Being Called

I've tried to fix this for hours and i'm pulling my hair out, no matter what i do it refuses to call the CSS in the media tag the instant i add max-width or min-width. To test, i m

Solution 1:

You haven't specified a pixel value. Try:

@media screen and (min-width:500px){
{body{background-color:#FF0000;}
}

Solution 2:

To expand on the previous answer, you didn't specify any unit, it doesn't need to be pixels.

You could use absolute lengths ‘cm’, ‘mm’, ‘in’, ‘pt’, ‘pc’, or ‘px’, font-relative lengths ‘em’, ‘ex’, ‘ch’, or ‘rem’ or the viewport-percentage lengths: the ‘vw’, ‘vh’, ‘vmin’ or ‘vmax’. And that's just lengths, there are many other units you can use in media-queries including pixel density, device orientation, device type, etc.