Home

CSS Media Queries Issue

%3CLINGO-SUB%20id%3D%22lingo-sub-867422%22%20slang%3D%22en-US%22%3ECSS%20Media%20Queries%20Issue%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-867422%22%20slang%3D%22en-US%22%3E%3CP%3ECSS%20media%20queries%20seem%20to%20be%20firing%20too%20soon.%20I%20have%20one%20set%20at%201600px%20which%20is%20firing%20at%201760px.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20style%3D%22width%3A%20400px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Fgxcuf89792.i.lithium.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F132783iD5D30B4604A2299C%2Fimage-size%2Fmedium%3Fv%3D1.0%26amp%3Bpx%3D400%22%20alt%3D%22Annotation%202019-09-20%20161600.png%22%20title%3D%22Annotation%202019-09-20%20161600.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3ESome%20of%20my%20CSS%20here...%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E.main-header%20%7B%3CBR%20%2F%3Emin-height%3A%20100vh%3B%3CBR%20%2F%3Epadding%3A%200%2015rem%3B%3CBR%20%2F%3E%7D%3C%2FP%3E%3CP%3E%40media%20(max-width%3A%201600px)%20%7B%3CBR%20%2F%3E.main-header%20%7B%3CBR%20%2F%3Epadding%3A%200%204rem%3B%3CBR%20%2F%3E%7D%3CBR%20%2F%3E%7D%3C%2FP%3E%3CP%3E~~~%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-867549%22%20slang%3D%22en-US%22%3ERe%3A%20CSS%20Media%20Queries%20Issue%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-867549%22%20slang%3D%22en-US%22%3EHi%2C%3CBR%20%2F%3Ewhich%20browser%20channel%20and%20version%20is%20this%20happening%20on%3F%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-867550%22%20slang%3D%22en-US%22%3ERe%3A%20CSS%20Media%20Queries%20Issue%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-867550%22%20slang%3D%22en-US%22%3EHi%2C%3CBR%20%2F%3Ewhich%20Edge%20insider%20channel%20and%20version%20are%20you%20using%3F%3C%2FLINGO-BODY%3E
ex-jedi
Occasional Contributor

CSS media queries seem to be firing too soon. I have one set at 1600px which is firing at 1760px.

 

Annotation 2019-09-20 161600.png

 

Some of my CSS here...

 

.main-header {
min-height: 100vh;
padding: 0 15rem;
}

@media (max-width: 1600px) {
.main-header {
padding: 0 4rem;
}
}

~~~

 

1 Reply
Hi,
which Edge insider channel and version are you using?
Related Conversations