Thomas Luethi: Tabellenbreiten

Beitrag lesen

Hallo,

ich möchte gerne folgendes Layout mit Hilfe von Tabellen verwirklichen.

Tabellenbreite=100%

  1. Zeile: Header mit colspan=3
  2. Zeile: Menu mit Breite=60
              Inhalt mit variabler Breite
              Hilfe mit Breite=60

Wie kriege ich es hin das die Menus immer auf 60 bleiben und nur der Inhalt skaliert, wenn ich das Fenster kleiner oder größer mache.

Gib den Zellen links und rechts in der zweiten Zeile je die Breite 60.
A propos: 60 was? 60 Pixel scheint mir sehr, sehr wenig zu sein.
Aber sei's drum. Du kannst es ja immer noch aendern.

HTML:
<table id="layouttabelle">
  <tr><td id="header" colspan="3">Header</td></tr>
  <tr>
    <td id="menue">Menue...</td>
    <td id="inhalt">Inhalt...</td>
    <td id="hilfe">Hilfe...</td>
  </tr>
</table>

CSS:
table#layouttabelle { width:100%; margin-top:0; }
td#menue { width:60px; }
td#hilfe { width:60px; }

Die uebrigen IDs habe ich mal schon vorsorglich ins HTML geschrieben,
auch wenn Du sie fuer diesen Zweck eigentlich noch nicht brauchst.

---

Veraltet - mit HMTL-Attributen - wuerde die Geschichte so aussehen:

<table width="100%">
  <tr><td colspan="3">Header</td></tr>
  <tr>
    <td width="60">Menue...</td>
    <td>Inhalt...</td>
    <td widht="60">Hilfe...</td>
  </tr>
</table>

---

Du kannst beides (HTML + CSS) auch kombinieren (im Zweifelsfalle sollte CSS "gewinnen"),
aber ich wuerde nur noch voll auf CSS setzen.

Lektuere:
http://selfhtml.teamone.de/css/index.htm
http://selfhtml.teamone.de/css/eigenschaften/tabellen.htm
http://www.w3.org/TR/REC-CSS2/tables.html

http://selfhtml.teamone.de/html/tabellen/gestaltung.htm#breiten_hoehen
http://selfhtml.teamone.de/html/tabellen/aufbau.htm#vordefinieren

Gruesse,

Thomas