Hello everyone, please tell me how to make it so that when you hover it’s not the color that appears, but the links drop down. I want to apply in the vertical menu.

<html> <style type="text/css"> .section { background:#ccc; } .layer { background:#ddd; } .section:hover img { border:2px solid #333; } .section:hover .layer { border:2px solid #F90; } </style> </head> <body> <div class="section"> <img src="myImage.jpg" /> <div class="layer">Lorem Ipsum</div> </div> </body> </html>

  • Well, if my memory does not fail me, then this cannot be done in CSS. But can JS - Pavel

1 answer 1

Something like this

 .section { background: #ccc; } .layer { background: #ddd; height: 0; overflow: hidden; transition: all 0.2s; } .section:hover img { border: 2px solid #333; } .section:hover .layer { height: 18px; } 
 <div class="section"> <img src="myImage.jpg" /> <div class="layer">Lorem Ipsum</div> </div>