LESS條件填充？

也許有條件的填充是不是要走的路，但 -LESS條件填充？

我有一個包含一個<img>，應填寫如果可以的可用垂直空間（90像素）一個div，否則應垂直居中。這裏有一個小提琴試玩問題：

如何使用LESS/CSS（不JS）做到這一點？

// code for image 
.folder-box img { 
    max-height: 90px; 
    max-width: 100%; 
}

來源

2013-08-17 RobVious

可能不會，因爲你想要做的事情需要由瀏覽器動態決定。 LESS只是一種編譯成CSS的語言。您可能需要JavaScript –

「可用空間」意味着90px高度100％寬度是正確的嗎？ –

@FabrícioMatté是 – RobVious

如果我理解正確的話，這是一個簡單的CSS問題，可以通過使用垂直居中解決：

Example Fiddle

唯一的風格，我是加那些圖片：

.folder-box img { 
    top: 0; left: 0; bottom: 0; right: 0; 
    position: absolute; 
    margin: auto; 
    max-width: 100%; 
    max-height: 100%; 
}

如果您需要爲您的標題元素定義空間，您可以簡單地將圖像包裝到另一個容器中，並設置padding-bottom和position: relative。

來源

2013-08-18 09:51:07 nirazul

謝謝！如果要將「可用高度」限制在頂部90像素以下，以便圖像不會跨越文本，但仍位於其上方？ – RobVious

然後，你還需要說包裝圖像的容器：** [小提琴（第一塊）]（http://jsfiddle.net/PTSkR/170/）** – nirazul

完美，我知道它必須是簡單的東西。再次感謝：） – RobVious

LESS條件填充？

回答

相關問題