Question

I’ve been looking for a while for a way to do percent to pixel calculations without using calc(). I’d love to be able to use calc but currently mobile safari (ios) does not support it before ios6. Is there a way to do this in LESS? I know you can do calculations but as far as I can tell you cant do something like 100% – 20px. Any suggestions?

Answer 1

No.

I spent a while searching for this when I first discovered about LESS, and I’m afraid it’s impossible. LESS doesn’t include a rendering engine and therefore has no way to work out exactly how wide a percentage of a parent element is going to be. Especially because quite often that parent element might be of variable width.

If the parent is of fixed width you can of course use LESS to calculate the pixels for you:

@containerWidth: 500px;
.container {width: @containerWidth;}
.child {width: @containerWidth / 5;}