So zentrieren Sie Text in einer Auswahlliste

Question

Ich habe Probleme beim Formatieren einer Auswahlliste in einem HTML-Formular. Grundsätzlich möchte ich, dass es eine Schriftgröße von 12px und eine Höhe von 30px hat; Das Problem ist, dass die Box auf die richtige Höhe gezeichnet wird, aber die Textwiedergabe variiert in jedem Browser. In FireFox wird es in der oberen linken Ecke gerendert. Ich möchte den Text vertikal zentrieren. Weiß jemand einen Weg, dies zu tun, oder muss ich etwas Brauchbares aus einer ul machen?

Dank

Answer 1

Der einzige Weg ist, um die <select> fallen zu lassen und ein <input type="text"< und ein <div> verwenden Ihnen das genaue Gefühl einer Auswahlliste zu geben, aber mit der Fähigkeit, alles zu tun, da es ein <li> sein, dass Sie am Ende haben.

Ich verwende diesen Ansatz, um nicht ausgerichteten Text anzuzeigen, aber ein kleines Symbol pro Zeile zu verwenden. Dies gibt mir auch die Möglichkeit, genau zu zeigen, wie ich will, egal welcher Browser auch verwendet wird.

wie das Bild unten

Answer 2

Sie können <select> Elemente mit CSS in allen Browsern nicht zuverlässig anpassen.

Sie müssen eine benutzerdefinierte Listensteuerung vornehmen.

Answer 3

Viel Glück damit, Text-Align funktioniert nur mit Blockelementen. Die Auswahlliste wird von Browsern unterschiedlich formatiert, wie es bei den meisten Formularfeldelementen der Fall ist (wie beim Dateieingabetyp). Wünsche für bessere Tage. Die Problemumgehungen, die ich dafür gesehen habe, sind wirklich hässlich.

Answer 4

Bit spät eine neue Antwort zu schreiben, aber bin ich auf Ihre Frage für die gleiche Antwort suchen und dachte, es muss einen anderen Weg geben.

Hurra! Ich habe einen gefunden!

Also für alle neuen Menschen diese Antwort zu finden kommt, ist hier, wie ich dieses Ziel erreicht haben:

einfach   verwenden manuell jede Option in der Dropdown-Liste zu zentrieren.