Using Less, can I use the current value in a @media section?

I have the following Less code:

@appbar-padding: 10px;

.container {
  padding-bottom: @appbar-padding + 10;
}

@media (min-width: 750px) {
    .container {
      padding-bottom: @appbar-padding + 20;
    }
}

Is it possible to take the current value of the padding-bottom in the @media part? So I could do something like:

@media (min-width: 750px) {
    .container {
        padding-bottom: @this + 10;
    }
}

This way, if I change the “normal” .container rules to, say, @appbar-padding + 20, the rules for screens bigger than 750px wide will, in effect, have @appbar-padding + 30 instead of + 20.


Source: css

Leave a Reply