創建具有定義的最小高度的可擴展CSS網格

Question

在所有CSS問題中，高度參數 - 這應該相當容易 - 總是讓我惱火。

我正在爲ExpressionEngine驅動的客戶端網站開發日曆組件。我使用的是SolSpace的日曆插件（這在後端很棒，順便說一句），它附帶的模板是基於表格的。

我想製作一個基於CSS的模板，並且我堅持如何管理單元格的高度。

下面是它看起來像現在：http://cornerstonearts.hostasaurus.com/calendar

起初，我成立了細胞，使他們將擴大時，事件的數量超過了可用空間。我這樣做，因爲你會發現：min-height:100%; overflow-y:hidden;

我也應用相同的設置，以包含DIV，這構成了每週的行和月容器。

問題是空單元完全崩潰，而溢出的單元彼此獨立擴展。後者推開了適當的一週行，但該行內的另一天單元格不會擴大以填充它們。結果，邊界全部失控（見附件）。

所以我改變了最小高度爲120px，但他們根本沒有展開。我也嘗試了height:120px; min-height:100%; overflow-y:hidden;的組合，但那也沒用。

我需要時如何使細胞擴大，並在周內擴大其他日子，但需要時卻保留最小高度。

一如既往，我非常感謝任何幫助。

感謝，

TY

Answer 1

你說的模板表爲主。你的意思是完全的HTML表嗎？如果是的話，我會把你在<td>上的屏幕截圖上的邊框放在div上。

css的問題在於，個人<div>不知道對方的身高是多少，除非它們互相嵌套，這對於您試圖達到的目標來說是不可行的解決方案。

其實，如果它是一個事件日曆，那麼它是表格數據，它是一個事件表。表本身沒有任何問題。像過去人們一樣使用它們來佈置整個網站。