:hover css funktoniert bei collection list nicht

[rocket-dev]

Hallo Zusammen,

ich stehe vor einem merkwürdigen Problem.

Ich habe die collection list des Shops unter https://dvvlbv1nv8mxd4ce-19788179.shopifypreview.com ein wenig umgebaut so dass statt dem Link ein button mit >unsere Kollektion je Kategorie angezeigt werden soll.

Der Button ist im Grunde ein Element das über CSS gestylt ist.

Für den Hover Effekt an dem Button habe ich folgendes CSS in der base.css implementiert:

.card_button:hover{
background:white !important;
border:1px solid;
color:black;
}

allerdings hat das keinen Effekt auf den Button (auch nicht mit der !important Anweisung.)

Weiter unten habe ich das gleiche für die vorgestellten Kreationen gemacht, da hat es einwandfrei funktioniert.

Hat jemand eine Idee woran das liegen kann ?

Danke und Grüße

[Niklas_g]

Hey, das ist vermutlich ein Problem mit dem hover Selektor.

Du könntest Das hier mal probieren:

.card_button:hover, .card-wrapper:hover .card_button{
background:white;
border:1px solid;
color:black}

[rocket-dev]

Hallo @Niklas ,

vielen Dank für deine Hilfe.

Das hat ganz gut funktioniert. Allerdings ist es etwas über das Ziel hinaus. So wird jetzt auch die Hintergrundfarbe des Buttons geändert auch wenn man nur über das Bild hovert.

Ist zwar nicht so schlimm aber eigentlich nicht die gelernte funktionsweise eines Buttons.

Viele Grüße

Andreas