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

回答

相关问题