I have the following structure:
<div class="submenu">
<ul>
<li>
<div class="btn-submenu btn-submenu-xstore"></div>
<a href="/plataforma-de-ecommerce">xStore - Plataforma de E-commerce</a>
<div class="submenuDescription">Tecnologia para a realização de vendas de forma prática, segura e completa.</div>
</li>
</ul>
I want the ul to modify the background of ul as well as the colors of to and div submenuDescription . And also the background-position of btn-submenu-xstore .
I did this from here, but it did not work:
.submenu ul:hover {background: #00478d;}
.submenu ul:hover .submenu ul li a {color: #fff;}
.submenu ul:hover .submenuDescription {color: #fff;}
.submenu ul:hover .btn-submenu-xstore {background-position: -50px}
The only thing that works is .submenu ul: hover {background: # 00478d;}