我有以下模拟我的问题的代码。我想使用百分比设置“Container”div 中元素的样式。因此,我必须将“Container”div 的高度设置为 100%(或其他值)才能完成这项工作。当我希望“容器”div 更改高度以反射(reflect)内容时,问题就出现了。在下面的例子中,我希望高度为 200%(在这种情况下,我知道“Container”的内容会起作用,但在现实世界中我有一个具有不同行数的数据网格)。如果我将高度设置为自动,则我无法使用百分比更改子元素。 有什么办法解决这个问题还是我设置了固定高度的容器?
谢谢,
丰富。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html style="height:100%">
<body style="height:100%">
<form style="height:100%">
<div id="Container" style="border:solid 5px;min-height:100%;height:100%">
<div style="height:100%; color:red"> TEST </div>
<div style="height:10%; color:red"> TEST </div>
<div style="height:10%; color:red"> TEST </div>
<div style="height:10%; color:red"> TEST </div>
<div style="height:10%; color:red"> TEST </div>
<div style="height:10%; color:red"> TEST </div>
<div style="height:10%; color:red"> TEST </div>
<div style="height:10%; color:red"> TEST </div>
<div style="height:10%; color:red"> TEST </div>
<div style="height:10%; color:red"> TEST </div>
<div style="height:10%; color:red"> TEST </div>
</div>
</form>
</body>
</html>
最佳答案
根据您的描述,这听起来像是表格数据。使用表格,它会自动调整以适合其内容,而无需您做任何努力。
关于html - 使用 CSS 中的百分比更改容器 div 的高度以反射(reflect)内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1621713/