sqwish
sqwish copied to clipboard
@media (max-width: Npx) queries parsed incorrectly
Media queries with max-width are parsed incorrectly, leading to errors in page display. May affect more than just those with max-width. For example
.class3 { margin: 0; } @media (max-width: 123px) { .class1, .class2 { width: 100% !important; max-width: 100% !important; } .class3 { font-size: 80%; } }
Becomes wrongly sqwished as:
.class3{font-size:80%;margin:0}@media (max-width:123px){max-width:100%!important;.class1,.class2{width:100%!important}}
Two issues:
- The max-width rule for class1&2 is placed before the class selector where it doesn't have any effect.
- The rule for class 3 is removed from the
@mediaquery and combined with the non-media-queried rule, where it has an effect even when it shouldn't.