設置所有Woocommerce產品相同的高度，但可變寬度

在我的site我希望我所有的產品具有相同的高度，但寬度可變。設置所有Woocommerce產品相同的高度，但可變寬度

我嘗試了它的UI，但它沒有奏效。

任何想法如何用CSS做到這一點？

感謝

2016-12-22 Juliatzin del Toro

像mnemosdev說，只是稍微複雜;）

您可以將樣式項目li像這樣：

.fusion-carousel .fusion-carousel-item { 
    height: 200px; /* set to your liking */ 
    width: auto !important; /* important needed to override inline style */ 
}

但你會看到圖像獲得真正的大。所以，他們的風格：

.fusion-carousel .fusion-carousel-item img { 
    height: 200px; /* set to your liking */ 
    width: auto; 
}

你其實並不需要的款式李物品，所以與圖像開始，然後調整自己的喜好。

來源

2016-12-22 20:05:29 yezzz

它運作良好，與寬泛的照片，我失去了比例：看這個網頁：http://catalogue2.cappiello.fr/index.php/full-shop-with-sidebar/ - Ami du peuple圖片（看到原圖大小，只要打開它） - 看我想達到的目標：http://catalogue.cappiello.fr/items/browse?sort_field=Dublin+Core%2CIdentifier –

我給你是爲鏈路上的caroussel的造型在你的問題http://catalogue2.cappiello.fr/，我沒有看到任何錯誤的比例，在該滑塊。你是否想要整店風格的頁面？ – yezzz

這是因爲在這個傳送帶上沒有寬幅的照片。對，我也將你的風格應用到整店商店頁面。現在導入1200張照片，所以你應該在旋轉木馬中找到很寬的圖片（但我不知道你會等多久） –

你的CSS應該有類似

.myCSSClass { 
width: auto; 
height: 100px; /* Instead of a 100px use the value you want */ 
}

編輯（我不能後尚未置評，因此我在這裏寫我的意見）：

隨着寬屏幕影像，因爲你正在失去這個比例，我想你可以使用一些像引導程序代碼片段來使圖像響應。如果您的圖像被設置爲CSS的背景，您可以使用背景大小設置來覆蓋。（http://www.w3schools.com/cssref/css3_pr_background-size.asp）

來源

2016-12-22 19:15:30 mnemosdev

設置所有Woocommerce產品相同的高度，但可變寬度

回答

相關問題