cambiare sfondo del sottomenu al passaggio del mouse

no.stress

cambiare sfondo del sottomenu al passaggio del mouse

Salve ragazzi
Ho creato un sottomenu e vorrei fare in modo che quando l'utente passa sopra le voci che lo compongono, lo sfondo da bianco passa a grigio chiaro (#cccccc).
Non riesco a capire come modificare il file.

Ecco la parte di codice che compone il sottomenu, sapete aiutarmi?
Grazie


.main-nav .sub-menu {
  display: none;
  margin: 0.75rem 0 -0.438rem;
  padding: 0;
}
@media screen and (min-width: 64.063rem) {
  .main-nav .sub-menu {
    margin-left: -1rem;
    margin-top: 0.62rem;
    position: absolute;
    width: 20rem;
  }
}
@media screen and (min-width: 64.063rem) {
  .main-nav .sub-menu .sub-menu {
    position: relative;
  }
}
.main-nav .sub-menu li {
  border-top: 0.063rem solid #fff;
  border-bottom: none;
  padding-right: 0;
  width: 100%;
}
@media screen and (min-width: 64.063rem) {
  .main-nav .sub-menu li {
    background:;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
    color: #000;
    left: -1rem;
    margin-top: 0.0rem;
    padding: 0.000rem 0.500rem;
    position: relative;
    width: 50%;
  }
}
@media screen and (min-width: 64.063rem) {
  .main-nav .sub-menu li a {
    color:;
  }
}

norman

Dovresti essere in grado di farlo con un qualcosa del genere, se non erro:


.main-nav .sub-menu li:hover a { color: #ccc; }

no.stress

niente non va, ho provato sia con

.main-nav .sub-menu li:hover a { color: #000; };
che con
.main-nav .sub-menu li:hover a { background color:; };

ma niente...

glorialchemica

Ciao No_Stress,
credo il problema stia nell'aggiungere **a
**In teoria tu vuoi che lo sfondo cambi colore, quindi solo l'elemento **li
**
Se stai usando un tema wordpress è possibile che tu abbia delle classi più specifiche per l'elemento li, come ad esempio: menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children
Quindi potresti provare così:

.main-nav ul.sub-menu > li.customclass:hover { background-color: #ccc}

se il tema è tuo aggiungi una classe specifica per questi li

Comunque utilizzando gli strumenti di ispezione per web master non dovrebbe essere troppo complesso trovare la classe interessata