Here is the document:

<div class="rate_num">...</div> <div class="rate">...</div> 

How to make the rate_num class have a border when you hover on a rate class?

Made such type:

 .rate a:hover .rate_num { border: 1px solid #ADBCCB; } 


 .rate a:hover ~ .rate_num { border: 1px solid #ADBCCB; } 

But both options do not work.

    1 answer 1

    : hover Will only work if the element that will have a border appears inside the element you are pointing at.

    If you use pure css, then you need to redo the markup like this:

     <div class="rate"> <div class="rate_num">...</div> ... </div> 

    then the recording will work

     .rate:hover .rate_num { border: 1px solid #ADBCCB; } 

    If the project uses jQuery to do so

     $('.rate').hover( function(){ $('.rate_num').css("border", "1px solid #ADBCCB" ); }, function(){ $('.rate_num').css("border", "none" ); } ); 
    • Thanks, corrected html css - rimlin