Mit kleinen Anpassungen und mittels Hilfe von diesem Autoprefixer hab ich es für Webkit hinbekommen.
Nur im IE klappt es leider noch nicht .
Dort scheint sich main nicht um den verfügbaren ungenutzten Platz zu vergrößern und der Footer sitzt direkt darunter und nicht am unteren Bildschirmrand.
Warum?
Das ist mein aktueller Code:
CSS
body {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
min-height: 100vh;
margin: 0 auto;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
font-size: 1em;
font-family: Arial, sans-serif;
overflow-y:scroll;
}
.main {
-webkit-box-flex: 1;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
}
.footer {
width: 100%;
margin: 60px 0px 10px 0px;
}
Alles anzeigen