Помогите корректно составить верстку. Есть готовый код ниже:
<div class="wrapper">
<div class="header"> HEADER </div>
<div class="content">
<button> START </button>
</div>
<div class="footer"> AUTHOR </div>
</div>
Нужно что бы у header класса была высота 30% окна браузера, у контента 60%, а у футера 10%. Кроме этого у них у всех должны быть вертикальные выравнивания. Почему-то ничего не получаеться. Не растягиваются блоки по высоте, растягиваются по контенту и в итоге не занимают все окно браузера! Если кто может написать корректный HTML/CSS код, напишите плиз! На крайняк можно использовать Bootstrap.