另一個DIV的DIV問題

Question

嘗試在徽標旁邊放置菜單（高度= 100％）時遇到問題。

好，圖像控制DIV（容器）的高度，在邏輯上，如果把另一個DIV（菜單）與height: 100%右側是DIV（容器）內，將留在整體高度，但不會結束意外事件發生。

3的嘗試，使用100%，auto和inherit

JSFIDDLE

Answer 1

要許多沮喪，height是特別挑剔CSS屬性。您會發現，如果未明確定義父元素的高度，則爲高度給出的任何百分比值將解析爲auto（Source here in the Values section）。這就是這裏發生的事情。

一個解決辦法是，嗯，明確設置家長的高度，就像這樣：

height: 150px; 

不幸的是，如果你不想做這樣的事情，你可能需要轉向一個JavaScript解。你知道，getting the height of the parent，然後設置孩子的身高等於該值。

Answer 2

一個可能的純CSS解決方案是將標題作爲table（徽標占據一個單元格，每個菜單項都是它們自己的單元格）。然後，表格會根據最高單元動態更改，因此如果您在菜單上放置了height: 100%，它們的大小應該高達徽標的高度。

請注意，您必須從菜單項中刪除float: right，否則這將無法正常工作。

jsFiddle