Als Tabellen noch nicht verpönt waren...
tabellenliebhaber
- html
...war vieles so viel einfacher!
Habe meine Probleme damit, das nachstehende Formular, was mit einer Tabelle sehr leicht in Form zu bringen war, ohne eben diese zweckentfremdende Nutzung des table tags und den Grundsätzen moderner und ordentlicher (X)HTML-Nutzung entsprechend wieder in die gleiche Form zu bringen:
<table border="1">
<tr><td colspan="7" align="center">Ablageboxen</td></tr>
<tr>
<td>Boxnummer</td>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
<th>5</th>
<th>6</th>
</tr>
<tr>
<td>Maximale Teileanzahl</td>
<td><input name="box[0][teileanzahl]" type="text" size="5" maxlength="5" /></td>
<td><input name="box[1][teileanzahl]" type="text" size="5" maxlength="5" /></td>
<td><input name="box[2][teileanzahl]" type="text" size="5" maxlength="5" /></td>
<td><input name="box[3][teileanzahl]" type="text" size="5" maxlength="5" /></td>
<td><input name="box[4][teileanzahl]" type="text" size="5" maxlength="5" /></td>
<td><input name="box[5][teileanzahl]" type="text" size="5" maxlength="5" /></td>
</tr>
<tr>
<td>Farbe</td>
<td><select name="box[0][farbe]" size="1"><option>Rot</option><option>Blau</option></select></td>
<td><select name="box[1][farbe]" size="1"><option>Rot</option><option>Blau</option></select></td>
<td><select name="box[2][farbe]" size="1"><option>Rot</option><option>Blau</option></select></td>
<td><select name="box[3][farbe]" size="1"><option>Rot</option><option>Blau</option></select></td>
<td><select name="box[4][farbe]" size="1"><option>Rot</option><option>Blau</option></select></td>
<td><select name="box[5][farbe]" size="1"><option>Rot</option><option>Blau</option></select></td>
</tr>
<tr>
<th>Abesenden</th><td colspan="6"><input name="submit" type="submit" value="Absenden" /></td></tr>
<tr>
<th>Felder Löschen</th><td colspan="6"><input type="reset" value="Felder löschen" /></td></tr>
</table>
Viele Grüße
Lars
Hallo,
Habe meine Probleme damit, das nachstehende Formular, was mit einer Tabelle sehr leicht in Form zu bringen war, ohne eben diese zweckentfremdende Nutzung des table tags und den Grundsätzen moderner und ordentlicher (X)HTML-Nutzung entsprechend wieder in die gleiche Form zu bringen
aber warum? Die Struktur, die mit dieser Tabelle abgebildet wird, legt den Schluss nahe, dass hier eine Tabelle genau richtig ist! Ich sehe hier eindeutug tabellarisch strukturierte Daten, wo die Spalten die Ablagefächer darstellen, und die Zeilen der Reihe nach deren Nummer, Teileanzahl und Farbe.
Wenn *DAS* keine Tabelle ist, was denn dann?
Nur das hier ...
<tr><td colspan="7" align="center">Ablageboxen</td></tr>
... will nicht so richtig passen. Das ist entweder eine Überschrift, die außerhalb der Tabelle plaziert wird, oder ein caption-Element innerhalb der Tabelle.
Und auch die Submit- und Reset-Buttons würde ich aus der Tabelle rausnehmen.
So long,
Martin
@@Der Martin:
nuqneH
Das ist entweder eine Überschrift, die außerhalb der Tabelle plaziert wird, oder ein caption-Element innerhalb der Tabelle.
Oder 'http://de.selfhtml.org/html/formulare/strukturieren.htm#gruppieren@title=legend' des 'fieldset'.
Qapla'
Ihr habt mich überzeugt!
Vielen Dank für die Korrekturen an meiner Tabelle!
Viele Grüße
Lars
@@tabellenliebhaber:
nuqneH
ohne eben diese zweckentfremdende Nutzung des table tags
Zweckentfremdet? Wie Cheatah sagte: für tabellarische Daten „ist alles andere als eine Tabelle falsch.“
Aber schaun wir mal:
<table border="1">
@border weg, Gestaltung mit CSS.
<tr><td colspan="7" align="center">Ablageboxen</td></tr>
Das sieht nach einer http://de.selfhtml.org/html/tabellen/umgebung.htm#beschriftung@title=Tabellenüberschrift aus.
<tr>
<th>Abesenden</th><td colspan="6"><input name="submit" type="submit" value="Absenden" /></td></tr>
<tr>
<th>Felder Löschen</th><td colspan="6"><input type="reset" value="Felder löschen" /></td></tr>
Die Buttons haben in der Tabelle nichts zu suchen. Und übrigens gibt es für Buttons auch http://de.selfhtml.org/html/formulare/klickbuttons.htm#modern@title=passende http://de.selfhtml.org/html/formulare/formularbuttons.htm#modern@title=Elemente.
Qapla'
Hallo,
Eine Tabelle ist hier, richtig angewandt, nicht fehl am Platze.
<form …>
<h1>Ablageboxen</h1>
<table>
<tr>
<th scope="row">Boxnummer</td>
<th scope="col">1</th>
<!-- … -->
</tr>
<tr>
<th scope="row">Maximale Teileanzahl</th>
<td><input name="box[0][teileanzahl]" type="text" maxlength="5"></td>
<!-- … -->
</tr>
<tr>
<th scope="row">Farbe</th>
<td><select name="box[0][farbe]"><option>Rot</option><option>Blau</option></select></td>
<!-- … -->
</tr>
</table>
<p><label for="submit">Absenden</label> <input id="submit" type="submit" value="Absenden"></p>
<p><label for="reset">Felder löschen</label> <input id="reset" type="reset" value="Felder löschen"></p>
</form>
Und den Rest machst du <http://de.selfhtml.org/css/eigenschaften/index.htm@title=mit CSS>: http://de.selfhtml.org/css/eigenschaften/schrift.htm@title=Schriftformatierung, http://de.selfhtml.org/css/eigenschaften/ausrichtung.htm@title=Textausrichtung, http://de.selfhtml.org/css/eigenschaften/positionierung.htm@title=Breiten, ggf. http://de.selfhtml.org/css/eigenschaften/rahmen.htm@title=Rahmen, (http://de.selfhtml.org/css/eigenschaften/innenabstand.htm@title=Innen-)http://de.selfhtml.org/css/eigenschaften/randabstand.htm@title=Abstände.
Mathias