는 값

Question

나는 기본적으로 다음과 같습니다 일부 LessCSS 있습니다

.foo { 
    @height: 20px; 
    @iconHeight: 13px; 

    background-position: 0 (@height - @iconHeight)/2; 
} 

그러나,이 분명히 background-position: 0 3.5px로 판명, 그것은 정수하는 내가 값 (원합니다을

background-position: 0 Math.ceil((@height - @iconHeight)/2) 

을도 아니다 자바 스크립트 평가 연산자를 사용하여 않습니다 :) Math.ceil의, 그러나이 작동하지 않습니다

background-position: 0 `Math.ceil((@height - @iconHeight)/2)` 

을

...이 부분은 Math.ceil(20px - 13px)으로 구문 분석되고 "px"에는 구문 오류가 있기 때문에

심지어 parseInt

0 `Math.ceil((parseInt('@{height}', 10) - parseInt('@{iconHeight}', 10))/2)`px 

사용하여 시도했다 그러나이 같이 밝혀 :

background-position: 0 4 px 

을 ... 옳지 않아있다. 그리고 마지막으로, 심지어 JS 평가에서 "픽셀"을 추가하는 것은

background-position: 0 `Math.ceil(....) + "px"`; 
// becomes 
background-position: 0 "4px"; 

이 확실히 더 나은 방법이 작동하지 않습니다!

Answer 1

임시 변수와 0px 해킹을 사용하여 문제를 간단하게 해결할 수 있습니다.

.foo { 
    @height: 20px; 
    @iconHeight: 13px; 

    @result: `Math.ceil((parseInt('@{height}') - parseInt('@{iconHeight}'))/2)`; 
    background-position: 0 (0px + @result); 
}