Answer the question
In order to leave comments, you need to log in
How to correctly write nested media in LESS?
@tablet-width: 660px;
@retina-dpi: 144dpi;
@retina-dppx: 1.5dppx;
@retina: (min-resolution: @retina-dpi), (min-resolution: @retina-dppx);
@media (min-width: @tablet-width) {
.block {
background: red;
}
@media (min-resolution: @retina-dpi), (min-resolution: @retina-dppx) {
.block {
background: green;
}
}
}
@retina
and write something like: @media @retina {}
@{retina}
and ~"@{retina}"
brackets in the variable itself. @media (min-width: 660px) {
.block {
background: red;
}
}
@media (min-width: 660px) and (-webkit-min-device-pixel-ratio: 1.5), (min-width: 660px) and (min-resolution: 144dpi), (min-width: 660px) and (min-resolution: 1.5dppx) {
.block {
background: green;
}
}
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question