CSS3列計數塊重疊覆蓋

Question

我正在使用css3列計數和列間距選項實現多列布局。大量的div被安排在主div內的2列中。問題是我想在重疊邊界的內部div中使用下拉菜單。

問題：css3列選項會阻止其父母div在谷歌Chrome重疊的下拉菜單。試圖改變z-index和溢出選項..任何想法？謝謝！

Plunker：http://plnkr.co/edit/8CqzQkvP9emIWvSXBses?p=preview

編輯：好像鉻正在處理CSS3列在一般相當馬車。舉例來說，只要我將啓動符號圖標放入按鈕中，我就會看到更多問題。通常需要兩次點擊才能打開下拉菜單。另外，firefox在div中分佈更均勻。沒有發現任何有關這些問題..？

Answer 1

首先，z-index不會對嵌套元素做任何事情，與其父母相比。由於您嘗試重疊列，因此DOM中沒有元素實際重疊。列不是專門用於佈局的。相反，它們旨在在水平佈局上創建可讀的長文本。

您在Chrome中看到的內容直接來自W3C specification for multi-column layouts and how they should handle overflow。在這裏設置任何溢出並不涉及列，而只涉及列的容器。

如果您想完成您在此之後的佈局，我強烈建議您查看一個網格系統，如960 Grid或Bootstrap's grid system。