Hallo,
ich habe das Problem, dass sich die Fußzeile über den Inhalt legt, wenn der Inhalt größer wird als die Seitenhöhe. Das sieht dann nicht mehr so prickelnd aus.
Mir ist klar, dass ich irgendetwas falsch positioniert habe. Ich weiß nur nicht was.
Hier ist mal eine kurze Beschreibung.
Ein Div das alles umschließt.
Darin befindet sich ein weiters Div, dass die Navigation, den Inhalt, Hörproben und die Fußzeile beinhaltet.
Navigation, Inhalt und Hörproben stehen in 3 Spalten nebeneinander.
Die Fußzeile ist unten auf der Seite positioniert.
Code
<html>
<style>
body{
display:flex;
flex-direction:column;
text-align: center;
height:100%;
width: 100%;
padding: 5px 0 5px 0;
}
header{
border:1px solid black;
height:50px;
}
footer{
border:1px solid black;
height:50px;
}
nav{
border:1px solid black;
height:30px;
}
main{
align-content: stretch;
display:flex;
height:auto;
}
main div{
flex:1;
border:1px solid black;
}
</style>
<body>
<header>Header</header>
<nav>Navigation</nav>
<main>
<div>Navigation<br>
dsddd<br>fff<br>hj
</div>
<div>Inhalt</div>
<div>Hörprober</div>
</div>
</div>
</main>
<footer> Fusszeile</footer>
</body>
</html>