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%; 
}