Morgen,
zu meiner Struktur (siehe Anhang).
Ziel soll sein, dass sich der content des Rest des Platzes einnimmt.
Folgendes habe ich schon geschrieben, aber ich schaffe es nicht, dass er sich in der Höhe streckt ohne das Container überragt. Content ist scrollbar.
HTML-Code:
html {
height: 100%;
}
body {
display: flex;
flex-direction: column;
justify-content: space-between;
width: 100%;
height: 100%;
overflow: hidden;
}
.header {
overflow: hidden;
}
.main {
display: flex;
flex-direction: rows;
justify-content: space-between;
height: 100%;
}
/* inhalt = größe des menüs */
.left {
}
.right {
width: 100%;
overflow:hidden;
display:flex;
justify-content: space-between;
flex-direction: column;
}
.right_headline {
}
.right_content {
height: 100%
}
.right_footer {
}
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
<form target="_self" action="" method="post" style="height: 100%;">
<div class="header"> </div>
<div class="main">
<div class="left"> </div>
<div class="right">
<div class="right_headline"> </div>
<div class="right_content"> </div>
<div class="right_footer"> </div>
</div>
</div>
</form>
</body>
</html>