css - cssはホバー時に異なるdivを表示します

Question

別のdivにカーソルを合わせたときに、divを表示しようとしていますが、何らかの理由で、代わりに間違ったdivが表示されています。以下のリンクで私が何を意味するかがわかります。ホバーされているボックスの横ではなく、2番目のハートのアイコンを表示したいと思います。

.box-product-item:hover + .box-product-item .compare {
    display:  inline-block;
}

それが理にかなっていることを願っています。

score 0 · Accepted Answer

cssルールを次のように変更する必要があります

.box-product-item:hover .compare {
    display:  inline-block;
}

兄弟セレクター部分を取り除く。あなたが今それを持っているように、それ自体がホバーされているaの直前にある.compareaの内部はすべてすべきであると言っています。.box-product-item.box-product-itemdisplay: inline-block

1 に答える 1