我有两个容器里的漂浮物。容器需要封闭浮子，但保持最小高度100%（容器>另一个容器>浮子）。
我试过最小身高，但显然最小身高需要一个确切的身高，而不是最小的父母。所以它不会对两个容器都起作用，只能对外部容器起作用。
在容器上显示100%高的表似乎可以满足我的要求，使它们至少100%高，但如果内容较长，则可以拉伸。
问题是：
显示：表决定了容器的宽度。我不能将宽度设置为100%，因为稍后需要用边距定义它们的宽度。我需要它们像正常的div一样，占用所有可用的水平空间。
有办法解决我的问题吗？
http://jsfiddle.net/Ka3TT/2/
我的代码：
<html>
<body>
<div class="enclose2">
<div class="enclose1">
<div class="float">
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
Float<br>
</div>
<div class="float">Float</div>
<div class="float">Float</div>
</div>
</div>
</body>
</html>
我的CSS：
.float {
width:100px;
border:solid 1px black;
float:left;
}
.enclose1, .enclose2 {
height:100%;
display:table;
background-color:#ccc;
}
body, html {
width:100%;
height:100%;
}
最佳答案
这取决于你以后的利润率是多少，有点像是在没有这些信息的情况下在黑暗中拍摄的，但是你可以尝试使用如下方法：
.float {
border:solid 1px black;
float:left;
height:100%;
width:29%;
margin-left:20px;
}
.enclose1, .enclose2 {
height:100%;
display:table;
background-color:#ccc;
width:100%;
}
body, html {
width:100%;
height:100%;
}
它将三列保持成一行，并将它们扩展到相同的高度，同时让div水平扩展以填充整个可用空间。我不确定您的边距到底是什么，如果封装div要放在包装器中，或者完整的代码是什么样子的，所以您将不得不使用封装1&2宽度和.float宽度和边距来获得您所要寻找的大小。
注意：我也可能会有点困惑，因为你说你希望它们占用所有可用的水平空间，但是在浮动上有固定的100px宽度，并且不希望将封闭设置为100%宽度-我在示例中已经完成了这一操作，但是原理是在封闭上有固定的宽度和边距，就像这样：
.float {
width:33%;
border:solid 1px black;
float:left;
}
.enclose1 {
height:100%;
display:table;
background-color:#bbb;
width:800px;
margin:50px;
}
body, html {
width:100%;
height:100%;
}
.enclose2 {
height:100%;
background-color:#ccc;
display:table;
}
如果它只是你想用固定宽度为100px的浮点数水平扩展的封闭类，你总是可以把整个东西放在一个宽度为100%的包装中：100%添加填充，然后将“封闭”设置为宽度为100%，这与在“封闭”上放置边距的作用相同，但允许它水平扩展。
很抱歉这个冗长的回答，但这取决于最终的目标是什么。
关于html - 使显示:表格不设置宽度地填写水平空间，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/13521265/