Не получается прижать блок footer вниз. Подскажите как исправить:
<!DOCTYPE html>
<html lang="rus">
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="style.css">
<title>WORLD BANK Publications</title>
</head>
<body>
<div class="wrapper">
<div class="header">aa</div>
<div class="content">bb</div>
<div class="footer">cc</div>
</div>
</body>
</html>
файл style.css
*{
margin: 0;
padding:0;
}
html, body {
width: 100%;
min-height: 100vh;
background: #ffffff;
}
body{
display: block;
}
.wrapper {
display: -webkit-flex;
display: flex;
flex-direction: column;
min-height: 100vh;
margin: 0 auto;
width: 1024px;
}
.header{
flex: 0 0 auto;
}
.content {
flex: 1 0 auto;
}
.footer {
flex: 2 0 auto;
height: 55px;
background: blue;
}
К низу не прижимается блок footer
content