LESS'te Matematiksel İşlemleri İptal Etme

Bazen, LESS tarafından hesaplama komutu olarak algılanmaması gereken matematiksel işlemlerin olduğu durumlar olabilir. Örneğin, bu problem CSS'in calc fonksiyonunda ortaya çıkar:

div {
	width: calc(100% - 10px);
}

Neyse ki, LESS bu tür yerleri doğru bir şekilde işleyebilir ve derleme sırasında hesaplama yapmaz.

Ancak, hesaplama gerektirmeyen bir ifadenin başka bir yerde olduğu durumlar da olabilir, örneğin bir değişkende, işte böyle:

@exp: 100% - 10px;
div {
	width: calc(@exp);
}

Bu durumda, değişkene hesaplamanın sonucu kaydedilecek ve calc içine hesaplanmış değere sahip değişken gönderilecektir. Bunun olmasını engellemek için, ifadenin değiştirilmeden kalması gerektiğini açıkça belirtebiliriz.

Bunun için ifadeyi tırnak içine almalı ve önüne tilde işareti koymalıyız:

@exp: ~'100% - 10px';
div {
	width: calc(@exp);
}

Kodu, doğru şekilde çalışması için düzeltin:

@exp1: ~'80% + 10px';
@exp2: ~'30vh - 10px';

div {
	width: calc(@exp1);
	margin-top: calc(@exp2);
}