There is an arrow:

<div class="leftArrow arrow"><p>Предыдущий товар</p></div> 

She has the following styles:

 .arrow { position: absolute; top: 43%; width: 42px; height: 94px; } .leftArrow { left: -30%; } .arrow p { width: 200px; color: #9B9B9B; display: inline-block; vertical-align: middle; font: 100 20px dindisplay; } .leftArrow p { padding: 37px 0px; } .leftArrow p:before { content: ''; padding: 38.5px 42px 38.5px 0px; background: url(../img/arrows.png) no-repeat center left; } 

Is it possible to somehow make it so that when hovering on .leftArrow p background of .leftArrow p:before ?

1 answer 1

It is necessary to add:

 .leftArrow p:hover:before { background: ... ; }