爲什麼不是這個LESS mixin工作？

Question

.v-centered (@height,@width) { 
    width: @width; 
    height: @height; 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    margin: (@height/2)px 0 0 (@width/2)px; 
} 

我正在嘗試製作一個垂直居中放置的東西（非線高度方式），而且這個LESS mixin不起作用。我有一種感覺，它與我的margin: (@height/2)px 0 0 (@width/2)px;線有關，但我不明白我的語法錯在哪裏。任何幫助讚賞。

Answer 1

這取決於你如何使用它。現在你的代碼假設寬度和高度都是在沒有單位的情況下傳遞的，但你的width和height屬性不會附加一個單位，比如你的margin屬性。

此外，要正確居中您要否定您的利潤率。

.v-centered (@height, @width) { 
    width: @width; 
    height: @height; 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    margin: -(@height/2) 0 0 -(@width/2); 
} 

DEMO

用你的方法有