Thomas Luethi: Positionierung von 2 Elementen innerhalb von <li>...</li>

Beitrag lesen

Hallo,

Erstell eine Tabelle mit 3 Spalten ...
An die Tabelle hab ich auch gedacht, möchte sie jedoch vermeiden
(dw. steht das ja auch im CSS-Forum), zumal ich auch noch vorhabe,
die Seiten Sehbehindertengerecht zu machen.

Das, was Du praesentieren willst, sind doch tabellarische Daten,
die Du in 3 Spalten anordnest: Rang, Name, Leistung (oder so).
Es ist in diesem Fall voellig legitim, das TABLE-Element zu brauchen.
Das steht auch so in den Zugaenglichkeitsrichtlinien für Web-Inhalte (WCAG):

http://www.w3.org/Consortium/Offices/Germany/Trans/WAI/webinhalt.html#gl-table-markup
"Tabellen sollten verwendet werden, um tatsaechlich
tabellarische Daten ('Datentabellen') zu kennzeichnen."

Eine solche Tabelle ist uebrigens IMHO auch ueberhaupt kein
Problem fuer Sehbehinderte u.s.w.; sie "transformiert geschmeidig".

<table summary="Rangliste ...">
<tr><th>Rang</th> <th>Name</th> <th>Zeit (Sekunden)</th></tr>
<tr><td>1.</td> <td>Primus Renner</td> <td>25.2</td></tr>
<tr><td>2.</td> <td>Secundus Laeufer</td> <td>27.5</td></tr>
<tr><td>3.</td> <td>Third Man</td> <td>27.9</td></tr>
<!-- u.s.w. -->
</table>

Ich behaupte, dass diese Tabelle selbst von einem primitiven Browser
(z.B. Lynx) wie folgt dargestellt/vorgelesen wird:

Rang Name Zeit (Sekunden)
1. Primus Renner 25.2
2. Secundus Laeufer 27.5
3. Third Man 27.9

(Fuer ganz schlechte/alte Browser soll es offenbar notwendig sein,
am Ende der letzten Zelle einer Zeile (oder sogar am Ende jeder Zelle?)
noch ein <br>-Tag einzubauen:
... <td>25.2<br></td></tr>
Das ist aber nur ein Geruecht, das ich irgendwo irgendwann aufgeschnappt habe...)

In den (englischen) Beschreibungen der Techniken zur Umsetzung der WCAG
http://www.w3.org/TR/WAI-WEBCONTENT-TECHS/#gl-table-markup
http://www.w3.org/TR/WCAG10-HTML-TECHS/#tables
steht, wie man Tabellen optimieren kann/soll fuer Vorlese-Programme u.s.w.

Ausserdem ist es eine Frage der Ehre: In der Firma mecker ich
immer, wenn die Kollegen bei Web-Apps wilde Tabellen-in-Tabellen-
Konstrukte, nur um ein Wort an eine bestimmte Stelle zu bringen.

Das ist nicht das gleiche. Verschachtelte Tabellen sind veraltet, das stimmt.
Aber Du hast ja nur eine einzelne Tabelle mit tabellarischen Daten - was soll
daran unehrenhaft sein?

Du kannst natuerlich weiterhin versuchen, mit CSS (Stichworte: display:block und float
oder meinetwegen sogar display:table-cell u.s.w.) eine Tabelle nachzubauen.
Die Browser werden Dich wahrscheinlich schnell eines besseren belehren.

Als einzig zuverlaessige Loesung ohne Tabellen kommt mir <pre> bzw.
font-family:courier,monospace in den Sinn, wie es im Thread auch schon
vorgeschlagen wurde. Wenn Du die Liste sowieso serverseitig generierst,
sollte es ja eine Kleinigkeit sein, die entsprechenden Leerzeichen
einzufuegen. (in PHP z.B. mit der Funktion str_pad() oder so...)

Hoffe, das hilft Dir weiter!
Gruesse,

Thomas

P.S. In manchen Sportarten kann es doch vorkommen, dass sich zwei
  Athleten einen Rang teilen (gleiche Punktzahl/Zeit u.s.w.).
  Wenn Du _das_ mit einer einfachen <OL> (und ggf. CSS-Countern) loesen kannst,
  so dass es in >90% der aktuell benutzen Browser funktioniert, bist Du sehr gut!