Darelius: Tabelle mit CSS

Beitrag lesen

Also, ich habe mal wieder das Problem, daß ich das übernomme nahbe und es nicht klappt schnüff

es scrollt alles weg nicht nur der Bereich... Warum? keine Ahnung.. ich poste mal Quellcode, ist aber mit php:

data/Styles-css.css

body {
  margin: 0;
  height: 100vh;
  display: grid;
  grid: "logo nav1" 100px
        "nav2 main" 1fr
        / 134px 1fr;
}
#logo {
  grid-area: logo;
  background-color: #fcc;
  padding: 0em;
}
#nav1 {
  grid-area: nav1;
  background-color: #cfc;
  padding: 2em;
}
#nav2 {
  grid-area: nav2;
  background-color: #ccf;
  padding: 0.5em;
}
main {
  grid-area: main;
  background-color: #fcf;
  padding: 0 0.5em;
  overflow-y: scroll;
}

Index.php (oder test.php momentan)

<?php
include ("data/001-Basic.php");
include ("data/002-Main.php");
BasicSite();
Logo();
Nav(1);
Nav(3); 
main();
?>

data/001-Basic.php

<?php

# ==============================
# 
# Basic Site
# t= title
# 
# ==============================
function BasicSite($t="Galaxie Erforschung")
{
   # Basic Site
   echo "<html>\n<head>\n<title>".$t."</title>\n";
   echo '<link rel="stylesheet" href="data/Styles-css.css">'."\n";
   echo "</head>\n<body>\n";
}
function BasicSiteClose()
{
   # Basic Site Close
   echo "</body>\n</html>\n";
}


# ==============================
# 
# Logo Xanai
# 
# ==============================
function Logo()
{
   # Logo (Xanai)
   echo '<div id="logo"><img src="pics/Logo-Xanai.png"></img></div>'."\n";
   
   
}
# ==============================
# 
# Navigation lines
# 0= upper logged out
# 1= upper logged in
# 2= left logged out
# 3= left, logged in
# 
# ==============================
function Nav($n=0)
{
   # Basic Navigation with options
   if ($n<=1)
   {
      echo '<div id="nav1">'."\n";
      echo "<table>\n<tr>\n";
      echo "<td>Hauptseite</td>\n";
      echo "<td>Aktuelles</td>\n";
      echo "<td>Forum</td>\n";
   if ($n==1)
      {
         echo "<td>Login</td>\n";
         echo "<td>Register</td>\n";
      }
      else
      {
         echo "<td>Logout</td>\n";
      }
      echo "</tr>\n</table>\n";
      echo "</div>\n";
   }
   else
   {
      echo '<div id="nav2">'."\n";
      echo "<table>\n";
   if ($n==3)
      {
         echo "<tr><td>Übersicht</td></tr>\n";
         echo "<tr><td>Planeten</td></tr>\n";
         echo "<tr><td>Kolonien</td></tr>\n";
         echo "<tr><td>Flotten</td></tr>\n";
         echo "<tr><td>Bautruppen</td></tr>\n";
         echo "<tr><td>Forschung</td></tr>\n";
         echo "<tr><td>Diplomatie</td></tr>\n";
      }
      echo "</table>\n";
      echo "</div>\n";
   }
   
   
   
}
?>

data/002-Main.php

<?php

# ==============================
# 
# Main Site
# t= Site Number
# 
# ==============================
function main($t=0)
{
   # Basic Site
   echo '<div id="main">'."\n";
   for ($a=1;$a<=100;$a++)
   {
      echo "Hauptseite: Zeile ".$a."<br>\n";
   }
   echo "</div>\n";

}

?>

Daraus resultiert dann das:

<html>
<head>
<title>Galaxie Erforschung</title>
<link rel="stylesheet" href="dat/Styles-css.css">
</head>
<body>
<div id="logo"><img src="pics/Logo-Xanai.png"></img></div>
<div id="nav1">
<table>
<tr>
<td>Hauptseite</td>
<td>Aktuelles</td>
<td>Forum</td>
<td>Login</td>
<td>Register</td>
</tr>
</table>
</div>
<div id="nav2">
<table>
<tr><td>Übersicht</td></tr>
<tr><td>Planeten</td></tr>
<tr><td>Kolonien</td></tr>
<tr><td>Flotten</td></tr>
<tr><td>Bautruppen</td></tr>
<tr><td>Forschung</td></tr>
<tr><td>Diplomatie</td></tr>
</table>
</div>
<div id="main">
Hauptseite: Zeile 1<br>
Hauptseite: Zeile 2<br>
Hauptseite: Zeile 3<br>
Hauptseite: Zeile 4<br>
Hauptseite: Zeile 5<br>
Hauptseite: Zeile 6<br>
Hauptseite: Zeile 7<br>
Hauptseite: Zeile 8<br>
Hauptseite: Zeile 9<br>
Hauptseite: Zeile 10<br>
Hauptseite: Zeile 11<br>
Hauptseite: Zeile 12<br>
Hauptseite: Zeile 13<br>
Hauptseite: Zeile 14<br>
Hauptseite: Zeile 15<br>
Hauptseite: Zeile 16<br>
Hauptseite: Zeile 17<br>
Hauptseite: Zeile 18<br>
Hauptseite: Zeile 19<br>
Hauptseite: Zeile 20<br>
Hauptseite: Zeile 21<br>
Hauptseite: Zeile 22<br>
Hauptseite: Zeile 23<br>
Hauptseite: Zeile 24<br>
Hauptseite: Zeile 25<br>
Hauptseite: Zeile 26<br>
Hauptseite: Zeile 27<br>
Hauptseite: Zeile 28<br>
Hauptseite: Zeile 29<br>
Hauptseite: Zeile 30<br>
Hauptseite: Zeile 31<br>
Hauptseite: Zeile 32<br>
Hauptseite: Zeile 33<br>
Hauptseite: Zeile 34<br>
Hauptseite: Zeile 35<br>
Hauptseite: Zeile 36<br>
Hauptseite: Zeile 37<br>
Hauptseite: Zeile 38<br>
Hauptseite: Zeile 39<br>
Hauptseite: Zeile 40<br>
Hauptseite: Zeile 41<br>
Hauptseite: Zeile 42<br>
Hauptseite: Zeile 43<br>
Hauptseite: Zeile 44<br>
Hauptseite: Zeile 45<br>
Hauptseite: Zeile 46<br>
Hauptseite: Zeile 47<br>
Hauptseite: Zeile 48<br>
Hauptseite: Zeile 49<br>
Hauptseite: Zeile 50<br>
Hauptseite: Zeile 51<br>
Hauptseite: Zeile 52<br>
Hauptseite: Zeile 53<br>
Hauptseite: Zeile 54<br>
Hauptseite: Zeile 55<br>
Hauptseite: Zeile 56<br>
Hauptseite: Zeile 57<br>
Hauptseite: Zeile 58<br>
Hauptseite: Zeile 59<br>
Hauptseite: Zeile 60<br>
Hauptseite: Zeile 61<br>
Hauptseite: Zeile 62<br>
Hauptseite: Zeile 63<br>
Hauptseite: Zeile 64<br>
Hauptseite: Zeile 65<br>
Hauptseite: Zeile 66<br>
Hauptseite: Zeile 67<br>
Hauptseite: Zeile 68<br>
Hauptseite: Zeile 69<br>
Hauptseite: Zeile 70<br>
Hauptseite: Zeile 71<br>
Hauptseite: Zeile 72<br>
Hauptseite: Zeile 73<br>
Hauptseite: Zeile 74<br>
Hauptseite: Zeile 75<br>
Hauptseite: Zeile 76<br>
Hauptseite: Zeile 77<br>
Hauptseite: Zeile 78<br>
Hauptseite: Zeile 79<br>
Hauptseite: Zeile 80<br>
Hauptseite: Zeile 81<br>
Hauptseite: Zeile 82<br>
Hauptseite: Zeile 83<br>
Hauptseite: Zeile 84<br>
Hauptseite: Zeile 85<br>
Hauptseite: Zeile 86<br>
Hauptseite: Zeile 87<br>
Hauptseite: Zeile 88<br>
Hauptseite: Zeile 89<br>
Hauptseite: Zeile 90<br>
Hauptseite: Zeile 91<br>
Hauptseite: Zeile 92<br>
Hauptseite: Zeile 93<br>
Hauptseite: Zeile 94<br>
Hauptseite: Zeile 95<br>
Hauptseite: Zeile 96<br>
Hauptseite: Zeile 97<br>
Hauptseite: Zeile 98<br>
Hauptseite: Zeile 99<br>
Hauptseite: Zeile 100<br>
</div>
</body>
</html>

und da scrollt (wie immer bei mir ) alles, nicht nur "main"...

Im "Beispiel", als ich das 1:1 übernahm, ging es, jetzt nicht, ich verstehe nur nicht, warum? Entweder habe ich einen kleinen, feinen, sehr fiesen Feheler oder ich bin zu blöd irgendwie...

...DX