Tabellen sind das ungeeignetste Layout-Mittel -> CSS!

[Felix Riesterer]

Lieber Jonas,

http://testplattform.te.ohost.de/index.htm [...] die CSS Datei [...]

wenn Du schon CSS einsetzt, warum verwendest Du dann Tabellen für etwas, das keine tabellarischen Daten sind? Verwende Dein CSS doch noch konsequenter, indem Du alles, was irgendwie für das Aussehen (und nicht für die inhaltliche Struktur) im HTML-Code steht, heraus nimmst und nur mittels CSS steuerst.

Wenn Du Deine Inhalte dann auch noch ihrer Natur nach auszeichnest (Die Hauptüberschrift Deiner Seite ist keine <h3> sondern eine <h1>, eine Navigation ist eine _Liste_ von links, steht also in einer <ul> oder <ol>...), dann sollte es nicht mehr schwierig sein, die vielen verschiedenen HTML-Elemente mit CSS zu gestalten.

Zu Deinen "Boxen" (am Beispiel Deiner Navi):
Sollte Deine Navi einmal sinnvoll als <ul> ausgezeichnet sein, dann kannst Du ihr zwei Hintergrundbilder verpassen, die die runden Ecken darstellen.
HTML-Teil:

<div id="haupt-navi">  
    <h2>Navigation</h2>  
    <ul>  
        <li class="angezeigte-seite"><a href="index.htm">Home</a></li>  
        <li><a href="hausaufgaben.htm">Hausaufgaben</a></li>  
        <li><a href="arbeiten.htm">Arbeiten / Tests</a></li>  
        <li><a href="uebersetzer.htm">Übersetzer</a></li>  
        <li><a href="forum.htm">Forum</a></li>  
        <li><a href="chat.htm">Chat</a></li>  
        <li><a href="gaestebuch.htm">Gästebuch</a></li>  
        <li><a href="fun.htm">FUN</a></li>  
        <li><a href="kontakt.htm">Impressum / Kontakt</a></li>  
    </ul>  
</div>

CSS-Teil:

#haupt-navi {  
    background: #ff7b10 url(/ob_li.gif) left top no-repeat;  
    width: 170px;  
}  
  
#haupt-navi h2 {  
    /* wenn die Überschrift nicht sichtbar sein soll: */  
    display: none;  
    /* aber für Screenreader ist sie sehr sinnvoll (für "barrierefrei"),  
       daher steht sie im HTML-Code trotzdem drin! */  
}  
  
#haupt-navi ul {  
    list-style: none;  
    background: url(/un_li.gif) left bottom no-repeat;  
}  
  
#haupt-navi li {  
    color: white;  
    text-align : right;  
}  
  
#haupt-navi li.angezeigte-seite {  
    text-align: left;  
}

Liebe Grüße aus Ellwangen,

Felix Riesterer.