百分比高度无效？

Question

百分比高度无效？

4

我想知道为什么这段代码中百分比高度不起作用：<div style="border-right:1px solid #000; height: 100%;"></div>。但是当我把高度改成像素时，它可以工作，但问题是高度以像素为单位固定。我将这个div元素用作垂直标尺/分隔线。这是我的代码：http://jsfiddle.net/jKGUC/5/。请帮忙解决，谢谢。

- NinjaBoy

2

100%px 不起作用。它只能是像素或百分比中的一种。 - Octavian Helm

我已经将它更改为100％并删除了“;”，但仍然无法工作。我也更新了我的链接。谢谢。 - NinjaBoy

2

100%是指什么？是指<body>还是左侧菜单？ - Alex

1

哈哈，无法让它像应该的那样工作......我明天会再试一次，现在太晚了。 - Alex

没关系，我也在尽力理解它。 - NinjaBoy

1

在td内部使用div是最糟糕的编码方式...如果你想要摆脱这些麻烦，就要摒弃table布局。 - Sparky

3个回答

6

将 table 和包围 div 的 td 中添加 height: 100%; 应该可以解决问题。这是更新后的 fiddle。 http://jsfiddle.net/jKGUC/9/

- keithwyland

0

如果父元素不是"像素"，那么它的子元素高度就无法设置为"百分比"。

- playjava

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- twaddington · Accepted Answer

height: 100%; 样式根据父容器的高度设置元素的高度。如果父容器是 body，则还需要在那些元素上指定高度。

html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}