Fehler bei der Positiopnierung
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.
Kommentar abgeben zu diesen Beitrag/Code ?Dann hier klicken
Der hier verwendete 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>