fieldset不遵循其父母的身高

我一直在試圖解決這個問題一段時間，找不到解決方案。fieldset不遵循其父母的身高

這裏是我的代碼

CSS

.parent{ 
    width:100px; 
    display:table; 
    border:1px solid green; 
} 

.child{ 
    width:50px; 
    background:blue; 
    display:table-cell; 
    height: inherit; 
} 

.child + .child{ 
    background:red; 
}

HTML

<body> 
    <div class="parent"> 
     <div class="child">a <br/> b<br/> b<br/> b<br/> b<br/> b<br/> b</div> 
     <div class="child" style="border: 2px dashed black"> 
      <fieldset style="height:100%;">a</fieldset> 
     </div> 
    </div> 
</body>

我想fieldset在第二個孩子div取父div的高度。所以，fieldset的高度應該等於它的div的height。

我該怎麼做？

來源

2012-02-02 IamaC

當父母的身高被聲明時，身高百分比起作用。在你的情況，height: inherit;，但它繼承沒有從它的父母稱爲.parent。在.parent上設置height修復它。（或者，您也可以設置所謂的.child比inherit其他一些孩子的height。）

http://jsfiddle.net/HtAJw/

HTML：

<div class="parent"> 
    <div class="child">a <br/> b<br/> b<br/> b<br/> b<br/> b<br/> b</div> 
    <div class="child" style="border: 2px dashed black"> 
     <fieldset style="height:100%;">a</fieldset> 
    </div> 
</div>

CSS：

.parent{ 
    width:100px; 
    display:table; 
    border:1px solid green; 
    height: 100% /* <-- added height to parent */ 
} 

.child{ 
    width:50px; 
    background:blue; 
    display:table-cell; 
    height: inherit; 
} 

.child + .child{ 
    background:red; 
}

來源

2012-02-02 17:32:40 Sparky

非常感謝您的解決方案..這對我的問題之一。但是我遇到了另一個問題。第一個孩子有其他Div，當頁面加載第二個孩子時，fieldset從父div的底部開始。我不明白爲什麼它這樣做？任何解決方案 – IamaC 2012-02-02 20:35:17

@lamaC，我不太理解你的後續問題。最好問一個新問題，然後加入一個展示新問題的jsFiddle。通常，當你使用高度作爲百分比時，你必須意識到鏈上每個父母的指定高度。 – Sparky 2012-02-02 21:48:25

感謝您的建議。這裏是我的新問題的鏈接http://stackoverflow.com/questions/9121034/table-cell-in-div-is-not-working – IamaC 2012-02-02 22:35:46

如果你想在表單該節始終佔據其父div的整個區域，然後使它

.child2 { 
    position: absolute; 
    left: 0; 
    right: 0; 
    top: 0; 
    bottom: 0; 
}

（固定值如適用）。

來源

2012-02-02 17:23:28

澄清。應將child2分配給該字段集。 – 2012-02-02 17:24:11

'位置：相對;'應該被添加到.child中，或者字段集將填充整個頁面 – Laxman13 2012-02-02 17:29:00

感謝您的更正，我在測試頁中設置了它，但錯過了這裏。 – 2012-02-02 17:32:00

fieldset不遵循其父母的身高

回答

相關問題