Einzelnen Beitrag anzeigen
  #8 (permalink)  
Alt 13.03.2020, 10:55
dh1sbg dh1sbg ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 08.04.2019
Beiträge: 5
dh1sbg befindet sich auf einem aufstrebenden Ast
Standard

ich habe einen funktionierenden Quelltext:
HTML-Code:
<!doctype html>
<html lang="de">
<head>
  <meta charset="utf-8"/>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Filter</title>
  <style type="text/css">

body {
	/* auf Grid umstellen */
	display: grid;				

	/* Grid Bereiche festlegen */
	grid-template-areas: 		
		"header header"
		"navigation main"
		"footer footer";

	/* Rows Höhe und col Breite festlegen  1fr=> ??*/	
	grid-template-rows: auto 1fr auto;	
	grid-template-columns: minmax(100px, 200px) 1fr ;  
	
	min-height: 100vh;
	}


.grid-header {
	grid-area: header;
	background-color:#fee;
	}

.grid-menu {
	grid-area: navigation;
	background-color: #eef;
	
	
	}

.grid-main {
	grid-area: main;
	}

.grid-footer {
	grid-area: footer;
	background-color:#fee;
	}

.grid-footer ul {
	display: flex; 
	list-style-type: none;
	
	}
  
  </style> 
</head>
<body>

<header class="grid-header"> 
	<p>kopfzeile</p>
</header>

<nav class="grid-menu">
	<ul> <li> item 1</li> <li> item 2 </li> </ul>
<?php
	//include("filter.php");
?>
</nav>
<main class="grid-main">
	<div style = "overflow-y: scroll;">
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	<h1> Best content ever </h1>
	</div>
</main>

<footer class="grid-footer">
	<ul> <li> item 1</li> <li> item 2 </li> </ul>
</footer>

</body>
</html>
Mit Zitat antworten