[solick]

Hi alle,

ich habe ein etwas seltsames Phänomen:

Mit WebKit Browsern unter Mac OS X scheint das Layouten von Buttons unter CSS anders zu funktionieren. Ich habe mal unter:

www.lm-consult.com/tt/test.html ein Beispiel eingestellt. Die Buttons 1-7 sollen die Tabellenzellen voll ausfüllen und daher groß aussehen. Unter Windows funktioniert das mit Firefox, IE8, Chrome und Safari!! Unter Mac dagegen nur mit FF. Safari und Chrome stellen die Buttons soweit ich das sehe im Standardlayout dar. Hat mir jemand einen Tipp, woran das liegen könnte bzw. wie man das ändert?

BTW: Die runden Ecken finde ich eigentlich ganz schick, kann man das auch für andere Browser übernehmen?

Beste grüße

Lyn

[solick]

Ich hab mittlerweile herausgefunden, dass man unter MacOS den Button wohl nur beeinflussen kann, wenn man border setzt. Das bedeutet aber dann, dass ich das Aussehen des Buttons komplett designen muss. Gibt es noch eine andere Lösung?

[David]

Schon mal "-webkit-appearance: none;" probiert?
CSS Property : -webkit-appearance

Mal ne Anmerkung: Für eine solche Umfrage wären wohl Radio-Buttons die bessere Wahl. Dann bitte auch mit den entsprechenden Label-Elementen.

[solick]

Webkit appearance schau ich mir an danke für den Hinweis.

Bezüglich Radio buttons: die haben wir bewusst nicth genommen, weil der klobigste Bereich gross sein soll und selbst enn man die Radio Buttons vergrössert (was man soweit ich weiss nicht kann), sähe es einfach nicht gut aus. Zudem wird es in der Umfrage auch antworten geben, die nicht aus zahlen bestehen.

Aber danke trotzdem für den Hinweis!

Beste Grüße

[David]

Nun ja, die HTML-Elemente sollte man nicht nach optischen Gesichtspunkten auswählen.
Was ist, wenn der Nutzer seine Wahl korrigieren möchte? Einmal auf den Button geklickt - vieleicht sogar aus Versehen - und die Frage ist ungewollt beantwortet.

Es spricht nichts dagegen ein Label-Element genau so zu gestalten wie deine Buttons jetzt aussehen, mit Hover-Effekt, etc. Der Radio-Button selbst muss nicht zwangsläufig in das UI-Design einfließen.

[solick]

Der Test soll bewusst direkt beim klicken die Frage beantworten. Es gibt die Möglichkeit, über einen normalen Button zur letzten, aber nur zur letzten, Frage zurückzukehren. Es wird nämlich auch die Antwortdauer gemessen und die fließt mit in die Bewertung ein. Das ganze ist ein psychologisches Testverfahren, da ist auch die Nutzerführung etc. vorgegeben...

[David]

Das mag ja alles Sein, aber die Umsetzung in HTML ist doch nicht vorgegeben, oder?
Auch bei der ersten Auswahl eines Radio-Buttons kann man das Absenden des Formulares mit JavaScript erzwingen.

[solick]

Doch insofern als Buttons gewünscht wurden...

[David]

push buttons: Push buttons have no default behavior. Each push button may have client-side scripts associated with the element's event attributes.

Quelle: Forms in HTML documents

Du wirst also um ein Script nicht umhin kommen. Womit ein weiterer Nachteil der Buttons verbunden ist: Was machst Du, wenn Javascript nicht aktiviert ist?

Edit: Kann einer der Mods das mal ins XHTML, oder Barrierefreiheitforum verschieben?

[solick]

Javascript ist zwingend vorausgesetzt, da aus verschiedenen Gründen Scripte laufen müssen. Insofern ist das nicht weiter tragisch.