Stefan E.: vertikale Navigation ohne table-Element

Beitrag lesen

Hallo ForumsleserInnen,

meine Navigation ist horizontal, wobei neben jedem Punkt links eine
dunkelgraue Linie ist (43 Pixel hoch). Der rechte Navigationspunkt
soll rechtsbündig sein, insgesamt verteilen sich die verschiedenen
Unterpunkte auf einer Breite von 553 Pixel.


(Die hellgraue Linie dient nur zur Sichtbarmachung des Bereiches)

Derzeit habe ich es mit einer Tabelle gelöst, der HTML-Teil lautet:
<table>
 <tr>
  <td>Lage</td>
  <td>Stadthäuser Typ B</td>
  <td>Stadthäuser Typ A</td>
  <td>Wohnungen</td>
  <td>Kontakt</td>
  <td id="i">Impressum</td>
 </tr>
</table>

... und dazu folgende CSS-Definitionen:
table {
 border-collapse: collapse;
 bottom: 0;
 height: 43px;
 margin: 0;
 position: absolute;
 right: 0;
 width: 553px;
}

td {
 border-left: 1px solid #424242;
 font-family: Tahoma, Arial, sans-serif;
 font-size: 11px;
 padding-bottom: 3px;
 padding-left: 7px;
 text-transform: uppercase;
 vertical-align: bottom;
}

td#i { width: 40px; }

*********************************************************************

Wie kann ich es sauber, d.h. ohne den Einsatz des table-Elementes
lösen? Die Lösung muß auch im Internet Explorer funktionieren.

Viele Grüße,
Stefan E.