FROM CACHE - de_header
Gelöst

:hover css funktoniert bei collection list nicht

rocket-dev
Shopify Partner
10 1 3

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. 

Bildschirmfoto 2023-10-23 um 12.59.58.png

Der Button ist im Grunde ein <a> 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

 

1 AKZEPTIERTE LÖSUNG

Niklas_g
Shopify Partner
34 8 22

Erfolg.

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}

 

 

Lösung in ursprünglichem Beitrag anzeigen

2 ANTWORTEN 2

Niklas_g
Shopify Partner
34 8 22

Erfolg.

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
Shopify Partner
10 1 3

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