Menu
I have a modal widget that shows in a page, and when I open it in IE11 it is partially broken, but as soon as I resize the window or open Developer Tools, everything gets fixed.
It seems that some of media queries are applied, like some of the rules for very small screen are used in a big one. But it is true not for all elements.
What am I doing wrong?
408
Since the issue was with media queries, I searched and found another answer to a similar question. Seemed to be my case: one of the symptoms was that lowest resolution media query was acting.
Answer: https://stackoverflow.com/a/25850649/171278
Solution: the lowest resolution media query should also have min-width, just add min-width: 1px, and it won't be activated on page load.
@media only screen and (min-width:1px) and (max-width:800px)
I encountered a similar issue (media queries weren't processed until the window was resized) and discovered that it went away when I moved the CSS from a dynamically-inserted <style> tag in the <body> to a static <link> in the <head>. (I'm not sure which of these changes actually fixed it, since by the time I discovered this workaround I was thoroughly fed up with the problem and didn't want to look into it any further.)
41
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
