Dropdowns mit CSS "besser" gestalten
0 0 0 
at
Dropdowns mit CSS "besser" gestalten
Hallo!
Ich habe mir ein schönes Stylesheet für Formulare geschrieben. Dabei versuche ich ohne Rahmen auszukommen. Das klappt auch ganz gut, bis auf Dropdown-Felder. Hier wird immer ein Rahmen angezeigt, auch der Knopf selbst bleibt schön hässlich.
So wie ich das sehe, kommt das Ding von der API des Browsers und lässt sich wohl nicht ändern.
Oder kennt ihr einen CSS-Style, den ich noch nicht kenne?
Was wäre mit einer JS-Dropdownbox? Kennt da jemand was vorgefertigtes?
Gruß
Andi
-
Moin!
So wie ich das sehe, kommt das Ding von der API des Browsers und lässt sich wohl nicht ändern.
Richtig. Formularfelder und deren CSS-Stylebarkeit sind ein diffiziles Thema. Aktuelle Browser schaffen es immerhin schon, dass Layer mit höherem z-Index die Formularfelder überdecken. Die Formatierung mit CSS hingegen ist oft ein Glücksspiel.
Wenn es nicht geht, dann geht es nicht. Es gibt keine speziellen CSS-Eigenschaften für unwillige Formularfelder. Wenn du den Rahmen ändern willst, ist die border-Eigenschaft richtig.
Allerdings ist anzumerken, dass insbesondere Select-Elemente wesentlich mehr Gestaltungsmöglichkeiten bieten (stell unter Windows einfach mal manuell an den Farben herum - alleine der 3D-Effekt des Knopfes besteht aus 3 verschiedenen Farben), als es offizielle CSS-Eigenschaften dafür gibt (gilt die background-color jetzt für den Knopf, oder für den Textbereich?). Insofern ist die Formatierbarkeit ohnehin ziemlich eingeschränkt.
Beim Firefox ist die Formatierung des Select-Elements sogar absichtlich von den Entwicklern abgeschaltet worden (durch einen Eintrag im Browser-Standardstylesheet) - in früheren Versionen ging da mal mehr.
Und andere Betriebssysteme wie OS X von Apple haben ohnehin keine einfarbigen Bedienelemente mehr, sondern diese "aqua"-Glaseffektbuttons, die man mit CSS sowieso nicht vernünftig umdefinieren könnte.
Deshalb ist mein Fazit: Von Formularelementen lasse ich meine CSS-Finger in der Regel weg, und überlasse die Darstellung dem lokalen Betriebssystemaussehen des Benutzers. Dann kann am wenigsten schief gehen.
- Sven Rautenberg
--
My sssignature, my preciousssss!-
Vielen Dank!
...auch wenn es mit lieber gewesen wäre, wenn ich mit meiner Vermutung falsch gelegen hätte.
Ich hab mir nun folgende Alternative überlegt: Ich definiere ein Dropdown aus DIVs, ähnlich einem Menü in welchem die zweite Ebene onMouseDown erscheint. OnClick wird dann der Wert übergeben.
Das wird noch ein bißchen dauern...
-
Moin!
Ich hab mir nun folgende Alternative überlegt: Ich definiere ein Dropdown aus DIVs, ähnlich einem Menü in welchem die zweite Ebene onMouseDown erscheint. OnClick wird dann der Wert übergeben.
Was ja nur funktioniert, wenn Javascript aktiviert ist - und hinsichtlich der Benutzbarkeit für alternative Zugangsformen (Sprachausgabe, Blindenzeile etc.) auch recht aufwendig anzupassen wäre. Sowas hilft also nur, wenn Design wirklich wichtiger ist, als Benutzbarkeit. Ich kenne Leute in diesem Forum, die sähen solch ein Vorhaben sehr kritisch.
Das wird noch ein bißchen dauern...
Aus nur diesem Grund würde ICH davon absehen. :) Man ist ja faul.
- Sven Rautenberg
--
My sssignature, my preciousssss!
-
-
Hallo.
Und andere Betriebssysteme wie OS X von Apple haben ohnehin keine einfarbigen Bedienelemente mehr, sondern diese "aqua"-Glaseffektbuttons, die man mit CSS sowieso nicht vernünftig umdefinieren könnte.
Die zu verwenden oder es zu lassen, ist aber Sache der Anwendungsentwickler. Und gerade Apple selbst verwendet sehr viele unterschiedlich gestaltete Sammlungen von Bedienelementen, darunter natürlich auch einige einfarbige.
MfG, at
-