CSS清除不工作，如果父母有身高：0

我遇到了一個奇怪的CSS問題。下面是我的HTMLCSS清除不工作，如果父母有身高：0

<div id="contact-me-content"> 

    <form action="" method="post"> 

     <label for="contact-name">Name</label> 
     <input type="text" name="contact-name" id="contact-name" placeholder="Your name" /> 

     <input type="submit" style="float:right" name="contact-submit" id="contact-submit" value="Send" /> 
     <div style="clear:both"></div> 

    </form> 
</div>

下面是CSS

#contact-me-content 
{ 
height: 0; 
padding: 5px; 
background: #ffffff; 
border-left: 1px solid #cccccc; 
border-right: 1px solid #cccccc; 
}

我浮提交按鈕右側，然後試圖清除浮動，這樣的形式被包含在父DIV。因爲父div有高度：0清除不起作用。但是，如果我刪除高度：0它工作正常。有沒有人知道這個方法或可以給我一個解釋？

感謝

來源

2013-03-16 Pattle

形式容器總會有因爲形式的一定高度，那麼爲什麼你需要的'身高：0'？ – 2013-03-16 23:37:40

@Pattle爲什麼你認爲結算在這裏不起作用？ – 2013-03-16 23:42:31

@ZoltanToth我需要高度爲0，因爲我想在頁面加載時隱藏div，但我可以用另一種方式 – Pattle 2013-03-16 23:54:33

爲了工作，你應該嘗試在#contact-me-content添加display: inline-block;那麼只有你的浮動元素可以有clear: both;

來源

2013-03-17 03:34:26

謝謝這工作:) – Pattle 2013-03-17 10:40:37

而不是使用height: 0隱藏你可以使用display: none或visibility: hidden的div。如果您必須使用height: 0，那麼還要將overflow: hidden添加到容器中，並且溢出的表單的任何部分都將被隱藏。請注意，填充使其具有一定的可見性，所以您可以將其設置爲0並稍後將其添加回來，或者將填充添加到表單元素中。

http://jsfiddle.net/ExplosionPIlls/BQCqJ/

來源

2013-03-16 23:59:09

CSS清除不工作，如果父母有身高：0

回答

相關問題