I had a strange problem today and couldn’t (immediately) find the answer on Google or via the LESS documentation, so I thought I’d note it here quickly.
A project uses LESS and needed a multi-value
border-radius, which I was trying to create thusly:
border-radius: 25% / 50%;
But the CSS that LESS was creating was:
Because it was seeing
25% / 50% and assuming I wanted
25% divided by
50%, which I most definitely did not…
I tried several options myself (like wrapping the values in quotes, escaping with the standard forward-slash), but all failed.
I tried Googling, but found only links to how to do calculations in LESS, not how to prevent them.
In the end, it’s pretty easy, actually:
border-radius: e("25% / 50%");