Gunnar Bittersmann: Rand in Tabellen funktioniert in Firefox nicht, IE aber OK!

Beitrag lesen

@@Peter:

http://www.musikkapelle-bischweier.de/kapelle.htm#diri19052005

Verweise einbinden.

<td class="Tdohnerahmen" width="100">

Damit setzt du die Spaltenbreite auf 100 Pixel. Der Leerraum zwischen den Inhalten wird damit mit größerer Schriftgröße kleiner. Zweckmäßig wäre eine Breitenangabe relativ zur Schriftgröße (in em).

Verzichte auf 'style'-Attribute! Verzichte auf HTML-Attribute wie 'width'! Mache ALLE Darstellungsangaben im Stylesheet!

Ich glaub, da blick ich dann nicht mehr durch, wenn ich das Gesamtbild der Tabelle und dann noch die Formatierung der Zellinhalte im CSS festlege.

Glaub mir, genau das fördert die Übersichtlichkeit, wenn alle Darstellungsangaben im Stylesheet stehen, nicht übers ganze HTML-Dokument verstreut.

Bennene Klassen nie nach der gegenwärtig gewünschten Darstellung!

Darf ich fragen, wieso nicht? (siehe "Anfänger")

Das hatte ich erst kürzlich beschrieben. Wegen eines Fehlers im Forum ([TICKET364], alle Jahre wieder) kann ich das Posting gerade nicht wiederfinden. Ich hoffe, der Fehler wird schnell behoben.

Und wenn alle Zellen derselben Klasse angehören, ist die Klassifizierung unnötig. Die Zellen lassen sich auch mittels Selektor für Nachfahren ansprechen:

Gehören sie nicht, hab teilweise auch Zellinhalte anderst formatiert.

Bei dir gehören ALLE 'td'-Elemente der Klasse "Tdohnerahmen" an; damit ist diese Klasse völlig überflüssig.

Schauen wir mal in deinen Quelltext:

<h2><a name="diri19052005"></a>Dirigenten 1905-2005</h2>

Alle diese 'a'-Elemente sind überflüssig. Stattdessen:

<h2 id="diri19052005">Dirigenten 1905-2005</h2> [SELFHTML: Anker definieren und Verweise zu Ankern.

Deine Tabelle sollte in etwa so notiert sein:

<table id="table_diri19052005">  
  <tbody>  
    <tr>  
      <th>1905-1909</td>  
      <td>Karl Berg, Rastatt</td>  
    </tr>  
    <tr>  
      <th>1909-1913</td>  
      <td class="Tdohnerahmen">Franz Vogt, Rastatt</td>  
    </tr>  
    <!-- ... -->  
  </tbody>  
</table>

Im Stylesheet:

#table_diri19052005  
{  
  margin-left: 5%;  
}  
  
#table_diri19052005 th  
{  
  width: 100px; /* Das war deine bisherige Angabe. Wie gesagt, besser in em angeben. */  
}

'th' ist für die Zellen der ersten Spalte das passende HTML-Element; es sind ja die Kopfzellen der jeweiligen Tabellenzeile. [SELFHTML: Tabellen definieren]

(Die Selektion der Zellen der ersten Tabellenspalte wäre in CSS auch mit der Pseudoklasse :first-child möglich; dafür ist aber der IE zu blöd.)

Eine andere Möglichkeit der Breitenangabe bietet das Vordefinieren von Spalten; aber nicht so wie in SELFHTML angegebn, sondern die Breitenangabe im Stylesheet!

Live long and prosper,
Gunnar

--
„Das Internet ist ein großer Misthaufen, in dem man allerdings auch kleine Schätze und Perlen finden kann.“ (Joseph Weizenbaum)