Select vs. checkbox oder: h-scroll soll weg!

[Der Martin]

Hallo,

Okay, irgendwie gehört es nach HTML und nach CSS...

nachdem du dich mal für eine Struktur entschieden hast, gehört es eigentlich nur noch in den Bereich CSS.

Nun habe ich mir überlegt, dass bei ggf. 200 Einträgen in der Liste es irgendwie blöd ist ständig Strg gedrückt zu halten und dass mancher nicht ganz so techy Benutzer das vielleicht nicht einmal weiß.

Ja. Listen mit Mehrfachauswahl sind allgemein problematisch: Zum einen ist die Möglichkeit der Mehrfachauswahl nicht erkennbar; zum andern wissen tatsächlich viele Benutzer nicht, wie das geht.

Daher die Überlegung das ganze mit Checkboxes zu machen

Halte ich hier auch für die bessere Wahl.

<fieldset class="lined_boxes checklist">
<legend>Stimmung/Adjektiv
<!-- Hier wieder besagte Tooltipp-Funktion, die aber in dieser Variante nicht wie gewünscht funktioniert.... anderes Thema. --></legend>
<ul class="checklist">
<li>
<input type="checkbox" name="upl_tag3[35" id="ulp_tag3_35" />
<label for="ulp_tag3_35">bedrohlich</label>
</li>

Willst du tatsächlich eine unpaarige eckige Klammer im name-Attribut der Checkboxen haben? Seltsam ...

</ul>
<br />
<input name="upl_tag3_other" type="text" />
</fieldset>

Das br-Element ist an dieser Stelle nicht nur unnötig, sondern unsinnig, denn ul ist ein Blockelement, das nachfolgende input steht also sowieso in einer neuen Zeile.

ul.checklist {
height:15em;
overflow:scroll;
margin:0 0 0 0.5em;
list-style-type:none;
list-style-position:inside;
}
ul.checklist li {
left:-2.5em;
}

Die left-Eigenschaft, die du für die li-Elemente setzt, hat keine Wirkung, solange du keine Angaben zu position machst.

Sondern vielmehr stört mich, dass in der zweiten Variante 1. mehr Platz verbraucht als benötigt wird (weil die Listenpunkte so weit eingerückt sind) und 2. eine horizontale Scrollbar erscheint, die ich nicht brauche.

Das mit dem Scrollbalken ist klar, den hast du ja über overflow:scroll explizit angefordert. Wenn du ihn nur da haben willst, wo er nötig ist, solltest du nicht scroll, sondern auto setzen (oder verwende nicht overflow, sondern overflow-y).

Das Einrücken der Listenelemente bekommst du weg, indem du padding-left für ul und margin-left für li eliminierst (beide, weil die verschiedenen Browser die Einrückung von Listen unterschiedlich realisieren).

(PS: Bitte haut mich nicht wegen der zweieinhalb br-Elemente, ich verwende die wirklich sparsam, nur in diesem Code-Fetzen eben nicht)

Aber wozu?

So long,
 Martin