I have this less and I can't figure out how to do the math inside the string
@bp-tablet-landscape: 1024px;
@bp-tablet-portrait : 768px;
@tablet-landscape-only: ~"only screen and
(min-width:@{bp-tablet-portrait} + 1) and (max-width: @{bp-tablet-landscape})";
Usage
div#header {
@media @tablet-landscape-only {
background: #000;
}
}
But it doesn't quite compile correctly. It doesn't add 768px + 1 as I had hoped. Any ideas? I've tried several different flavors and I can't nail it. I can obviously define a variable outside the string concat, but I'd like to avoid that approach if possible.
winLess online compiler outputs
@media only screen and (min-width:768px + 1) and (max-width: 1024px) {
div#header {
background: #000;
}
}
I want to get 769px
in there instead of 768px + 1
Not Within the String Itself, but...
If you separate it out of the string, then do a second interpolation following (note the 2nd
~
), this works:To produce this: