CSS 设置高度：我的标签元素上的 100% 不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4789835/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Setting height: 100% on my label element doesn't work
提问by Lucas Pelegrino
I tried to set height: 100%;in the label, but it didn't work. Why not?
我试图height: 100%;在标签中设置，但没有用。为什么不？
.field label {
color:#3E3E3E;
font-weight:bold;
width:80px;
display:block;
float:left;
margin-top:5px;
margin-left:3px;
height:100%; /* <-- doesn't work */
}
.field {
display:block;
margin-bottom:9px;
background:none;
border:none;
}<div class="field large">
<label>Textarea</label>
<textarea></textarea>
</div>回答by Rob
You have height set to 100% but 100% of what? It's always the parent of that element so what is the parent's height set to? If it's not set to anything then the browser has nothing to reference.
您将高度设置为 100% 但 100% 是什么？它始终是该元素的父元素，那么父元素的高度设置为多少？如果它没有设置为任何东西，那么浏览器就没有什么可参考的。
回答by Tim Goodman
In this case I believe your div's height is being determined by the height of the tallest element within it: the text-area. (Reference) Perhaps you want to figure out how many pixels tall your text-area is (for instance this can be done with Firebug, or IE or Chrome's developer tools), and then set your label to that same height.
在这种情况下，我相信您的 div 的高度由其中最高元素的高度决定：文本区域。(参考) 也许您想弄清楚您的文本区域有多少像素高（例如，这可以使用 Firebug、IE 或 Chrome 的开发人员工具来完成），然后将您的标签设置为相同的高度。
I'd also explicitly set that height for the text-area to be sure it's the same in all browsers.
我还明确设置了文本区域的高度，以确保它在所有浏览器中都相同。
The reason height: 100%isn't working as you expect is that the parent element has a height of auto. This results in your label also getting a computed height of auto.
原因height: 100%没有像您预期的那样工作是父元素的高度为auto. 这会导致您的标签的计算高度为auto。
<percentage>Specifies a percentage height. The percentage is calculated with respect to the height of the generated box's containing block. If the height of the containing block is not specified explicitly (i.e., it depends on content height), and this element is not absolutely positioned, the value computes to 'auto'.
<percentage>指定百分比高度。该百分比是根据生成的框的包含块的高度计算的。如果未明确指定包含块的高度（即，它取决于内容高度），并且该元素不是绝对定位的，则该值计算为 'auto'。(Reference参考）
