Hallo,

folgendes Problem: Unser Kunde wollte Buttons und Fortschrittsbalken gerne in seinem grün haben.
Hab ich recht schnell hingekriegt. Auch, dass die Buttons beim drüberfahren etwas dunkler werden.
Aber beim draufklicken werden sie immer noch blau.
So wie ich die verschiedenen Beiträge zu css verstehe, müsste das der Befehl :active sein.

So habe ich es programmiert
.btn-info{background-color: #6eb900; border-color: #6eb900}
.btn-info:hover{background-color: #5e9e00; border-color: #5e9e00}
.btn-info:active{background-color: #5e9e00; border-color: #5e9e00}

Und so wie auf dem Bild sieht es aus.

Ich hoffe, es kann mir jemand helfen.

Danke.
Ricarda

RicCX1 wrote: Aber beim draufklicken werden sie immer noch blau.

Gibt bei Bootstrap ja noch ein paar weitere Zustände. Was bedeutet draufklicken? Maustaste gedrückt halten? Oder nach dem Loslassen? Ich vermute mal Focus ist noch nicht auf die Farbe umstellt. Aber ich bin nicht oft in den Untiefen von CSS und Bootstrap unterwegs.

!important kann vielleicht wegfallen, aber stellt höchste Priorität sicher.

Allgemein ist es sinnvoll die verwendete LimeSurvey Version und das verwendete Theme zu nennen.

Es gibt noch ein paar Zustände mehr:

.button-info.active
.button-info.active:hover
.button-info:hover:hover

Am besten, die bootstrap.css einmal nach "button" durchforsten; dort sind ja die default-Farben, woran man dann gut erkennen kann, welcher Zustand dies ist.

Joffm

was passiert bei "hover:hover"?

Ich habe nicht die geringste Ahnung.
Dies stammt aus dem Theme "TFR-Retro" von Tammo.
Und diese Klassen haben wir in "skelvanilla" von Denis.
.btn-primary:focus
.btn-primary.focus
.btn-primary:hover
.btn-primary:active
.btn-primary:active:hover
.btn-primary:active:focus
.btn-primary:active.focus

.btn-primary.active
.btn-primary.active:hover
.btn-primary.active:focus
.btn-primary.active.focus

Danke euch.

mit ".btn-info:active:hover" funktioniert es jetzt.

Ich bin gerade erst dabei, das mit den css-Befehlen zu lernen.
Das hat bis Mai ein Kollege von mir gemacht.
Wenn er etwas schon mal gemacht hat, z.B. zoomen von eingebundenen Bildern oder irgendetwas ausblenden, dann kann ich mir das aus alten Vorlagen erschließen, aber das mit den Buttons hatte er auch noch nicht gemacht.

Zum Glück gibt es dieses Forum und ein paar Leute, ganz besonder Joffm, die eigentlich immer eine gute Antwort haben.

Joffm wrote: Ich habe nicht die geringste Ahnung.
Dies stammt aus dem Theme "TFR-Retro" von Tammo.

Code:

.btn-primary:hover:hover

Die Wiederholung von hover ist schon ungewöhnlich.

Könnte ein Trick sein. Vielleicht hilft die Wiederholung bei Hover z.B. zur Vermeidung von Problemen bei Touchscreens. Als Tippfehler würde es aber auch nicht weiter auffallen. Punkt und Doppelpunkt sind ja schnell mal anders gesetzt.

Eine Erklärung wäre schon interessant.