molily: Problem mit Tabellenlayout

Beitrag lesen

<?xml version="1.0" encoding="iso-8859-1"?>

Die XML-Deklaration solltest du weglassen, die bringt ältere IEs in den Quirksmode, was die Arbeit mit CSS erschwert.

<!--Tabellenanfang-->
<script language="JavaScript">
<!--

Die Auskommentierung von Scripten ist unnötig, du kannst einfach nur <script type="text/javascript"> schreiben (type- statt language-Attribut).

if (screen.availWidth >= 1650 ) {
  document.write ('<table border="2" align="center" width="1000">');

Warum musst du hier zwingend JavaScript voraussetzen? Was passiert ohne JS? Kannst du das Layout nicht auch ohne JavaScript anpassungsfähig an die Browserbreite gestalten?

<tr><td valign="top">

<strong class="navi">
<ul>

Die Zelle (td-Element) sollte die Breite bekommen. Du kannst eine ID verwenden und diese dem td vergeben, z.B. <td id="navi">, dann mit #navi ansprechen.
strong darf ohnehin kein ul enthalten, das Element wird dann überflüssig. Fettschrift kannst du im CSS regeln, sofern nötig.

<li><a href="home.html">Home</a></li>
    <li><a href="biografie.html"><font color="yellow">Über
Mich</font></a></li>

font?! Formatierungen solltest du über CSS regeln.

<script language="JavaScript">
<!--
if (screen.availHeight >= 1020 ) {
  document.write ('<div style="overflow: auto; height:660px;">');
} else if (screen.availHeight >= 994 ) {
  document.write ('<div style="overflow: auto; height:656px;">');
} else if (screen.availHeight >= 930 ) {
  document.write ('<div style="overflow: auto; height:592px;">');
} else if (screen.availHeight >= 870 ) {
  document.write ('<div style="overflow: auto; height:532px;">');
} else if (screen.availHeight >= 834 ) {
  document.write ('<div style="overflow: auto; height:496px;">');
} else if (screen.availHeight >= 738 ) {
  document.write ('<div style="overflow: auto; height:400px;">');
} else if (screen.availHeight >= 570 ) {
  document.write ('<div style="overflow: auto; height:370px;">');
}

Warum beschränkst du hier die Höhe, willst du, dass das Layout immer auf einen Bildschirm passt?
Das ist sehr schwer zuverlässig umsetzbar. Die Abfrage von screen.availHeight ist eine der unzuverlässigsten Methoden. Du musst damit rechnen, dass bei manchen Benutzern trotzdem zwei Scrollbars angezeigt werden. Du müsstest eher die Viewport-Höhe auslesen.

<tr><td colspan="2">
<div id="Fusszeile">Made by Max Mustermann © 2009 <br />
<a href="Home.html">www.Muster.de</a> <a href="impressum.html">Impressum</a></div>

Das zusätzliche DIV ist unnötig.
Allgemein solltest du dich langsam mit CSS-Layout beschäftigen.

muss ich dann auch noch dem Textbereich eine Breite zuweisen wenn ich dem Navi schon eine zugewiesen habe?

Nein, das ist nicht nötig, aber achte wie gesagt darauf, dem td die Breite zuzuweisen.

Mathias