CSS两列布局 - 高度100％，宽度100％

Question

看看我的小提琴：

http://jsfiddle.net/uvk80oob/

.content {
width: 70%;
height: 100%;
float: left;
bgcolor: #f8f4eb;
}

.sidebar{
width: 200px;
height: 100%;
float: left;
background: url(http://i.imgur.com/S0I0UaN.png) repeat left top;
}

我正在尝试为个人使用和学习目的制作一个简单的布局。经过三个多小时的尝试，这是我能得到的最接近的。我需要侧边栏背景图片的高度为100％。另外，我需要内容宽度为100％。

基本上，内容div必须始终为100％，并且侧边栏背景图像可以针对所有重要事项进行修复。但它需要达到100％的高度。

任何可以指引我朝正确方向前进的人？非常感谢提前！

Answer 1

检查这种方法：

http://jsfiddle.net/uvk80oob/4/

...您可以将侧边栏和内容包装在包装元素中并使用：

.wrap {
  display:table;
  height:100%;
}

.wrap > div {
  display:table-cell;
  height:100%;
}