Media queries reasoning #203
Replies: 2 comments 2 replies
-
maybe! they're called medium and below, |
Beta Was this translation helpful? Give feedback.
-
If you use In an example below .text {
font-size: var(--font-size-0);
@media (--md-n-above) {
font-size: var(--font-size-2);
}
}
.component {
@media (--md-n-below) {
.text {
font-size: var(--font-size-1);
}
}
} |
Beta Was this translation helpful? Give feedback.
-
I'm curious about decisions regarding MQ breakpoints. Especially why
xxx-n-above
andxx-n-below
are overlapping?This overlap is confusing for me. If I start from the mobile and go up everything is predictable.
--xs-n-above
for the small mobile view,--sm-n-above
for the large mobile view,--md-n-above
for the tablet view, etc.But I can't use the
--md-n-below
query to style the large mobile view because the styles are also triggered for the tablet view (768px).Wouldn't it better to change all
xxx-n-below
fromx <= width
tox < width
andxxx-only
fromx <= width <= y
tox <= width < y
?Beta Was this translation helpful? Give feedback.
All reactions