右侧边栏高度100％不起作用

Question

首先我做了很多搜索，并且所有的答案都建议将html和身高设置为100％，所以我这样做了但是没有用。

问题是，身体背景是灰色的（＃e5e5e5），右侧边栏可能会改变其背景颜色（#fff，或其他任何东西）

示例：http://jsfiddle.net/Lzm0mf9d/

在我的设计中：

html {
    height: 100%;
}
body {
    height: 100%;
    background-color: #e5e5e5;
}
.container {
    height: 100%;
}
.left {
    width: 300px;
    position: fixed;
    top: 0px;
    left: 0px;
    height: 100%;
}
.right {
    position: absolute;
    top: 0px;
    left: 300px;
    background-color: #FFF;
    width: calc(100% - 300px);
    height: 100%;
}

问题是，右侧背景与视口一样高。无论内容有多长。

<div class="container"><div class="left"></div><div class="right"></div></div>

Answer 1

或删除高度：100％inright。你想要实现什么目标？

Answer 2

尝试将div的display更改为inline-block;然后div不再“忽略”样式表高度。