protostar personalizzazione css menu

[upload]

Scusate ho un problema nella personalizzazione del menu seguendo le guide ho fatto alcune piccole modifiche ma non riesco a cambiare le classi hover,  focus e current nel menu.
e nel sub menu non riesco nemmeno a cambiare il background figuriamoci  hover,  focus e current 


galleggio su tentativi.... allego css e screenshot


 

Codice: [Seleziona]

.moduletable_min {
-webkit-box-shadow: 2px 2px 8px #000;
-moz-box-shadow: 2px 2px 8px #000;
box-shadow: 2px 2px 8px #000;
background: #800000;
padding:padding: 18px 25px 21px 25px;






margin-bottom: 20px;
}

.moduletable_min h3 {
color: #FBE689;
}
.moduletable_min a {
color: #FFF;
}
.moduletable_min li {
line-height: 25px;
}


.moduletable_min  active, a,  hover, focus {
color: #B36666;
}




#aside .moduletable_min .nav .nav-child {
border-left: none;
padding-left: 15px;
}


[giusebos]

non devi andare per tentativi, se non usi firebug ti occorre il mago otelma!

[adottauncane]

Ciao,
usa Firebug, se hai bisogno di una mano metti un link al sito e scrivi come li vorresti cambiare...

[upload]

come dicevo devo solo aggiungere la classe hover per tutti i tabs di primo e secondo livello assegnando un colore e cambiare colore in background alle sotto voci del menu.
in allegato il sottomenu  si vede bene ora è bianco e blu

[adottauncane]

Capisco. Ma se non metti un link non credo che nessuno sia in grado di aiutarti.

[upload]

purtroppo il link non esiste perchè il sito gira in locale su una rete interna.
Comunque dovrebbe essere sufficiente aggiungere delle classi nel css personalizzato che ho postato su, io vado ancora con prove varie ma non riesco a scrivere il css giusto  non è ancora la mia lingua...

[upload]

Dimenticavo di dire che il template è Protostar anzi dimenticavo anche di ringraziarti adottauncane perchè hai scritto una buona guida che ho seguito passo passo

[adottauncane]

Purtroppo la guida è vecchiotta e in parte non più valida...
Non mi sembra che le parti che hai individuato siano quelle giuste.
Ti metto qui le modifiche che ho fatto su un menù Protostar di un sito che sto cambiando per scrivere una nuova guida.
Sono una traccia, alcune parti non le vedrai (ad esempio i font) perché importati da Google font...
Fai un file user.css, basta che lo metti nella cartella css, è già richiamato dal index.php, incollacelo dentro e cambialo come ti serve...

Codice: [Seleziona]

/*Menù*/
.nav-list > .active > a, .nav-list > .active > a:hover, .dropdown-menu li > a:hover, .dropdown-menu .active > a, .dropdown-menu .active > a:hover, .nav-pills > .active > a, .nav-pills > .active > a:hover {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
  color: #666;
  font-family: Satisfy !important;
  font-size: 25px;
}
.navigation {
  border-bottom: 0 none;
  border-top: 0 none;
  border-left: 2px dotted #399097;
  padding:0;
  margin-bottom:20px;
}
.nav-pills > li > a {
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  border-radius: 0px;   
  margin-bottom: 0px;
  margin-top: 0px;
  padding-bottom: 15px;
  padding-top: 15px;
  font-family: Satisfy;
  font-size: 25px;
  border-right: 2px dotted;
}
.nav > li > a:hover,
.nav > li > a:focus {
  text-decoration: none;
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
}
.navbar .btn-navbar {
  background-color: #087e85;
  background-image: linear-gradient(to bottom, #087e85, #004466);
  border-color: #087e85;
}
.navbar .btn-navbar:hover,
.navbar .btn-navbar:focus,
.navbar .btn-navbar:active,
.navbar .btn-navbar.active,
.navbar .btn-navbar.disabled,
.navbar .btn-navbar[disabled] {
  color: #fff;
  background-color: #087e85;
  *background-color: #004466;
}
/*Sottomenù*/
.navigation .nav-child {
  background-color: #F6EBD4;
  border: 0;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  border-radius: 0px; 
  box-shadow: 0 0 10px #555;
  -moz-box-shadow: 0 0 10px #555;
  -webkit-box-shadow: 0 0 10px #555;
}
.navigation .nav-child a {
  color: #399097;
  font-family: Satisfy;
  font-size: 20px;
}
.navigation .nav-child li > a:hover,
.navigation .nav-child li > a:focus,
.navigation .nav-child:hover > a {
    text-decoration: none;
    color: #666;
    background-color: transparent;
    background-color: transparent;
    background-image: -moz-linear-gradient(top,transparent,transparent);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(transparent),to(transparent));
    background-image: -webkit-linear-gradient(top,transparent,transparent);
    background-image: -o-linear-gradient(top,transparent,transparent);
    background-image: linear-gradient(to bottom,transparent,transparent);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='transparent', endColorstr='transparent', GradientType=0);
}
/*Toglie freccia*/
.navigation .nav > li > .nav-child::before {
  display: none;
}

.navigation .nav > li > .nav-child::after {
  display: none;
}

[upload]

Funziona davvero bene!
Grazie e bello anche il sito con la grafica anni '50!
L'unica cosa che non mi viene ancora è impostare un   margin: auto; per centrare il menu nel layout fluido.
grazie di nuovo per il codice

[adottauncane]

Codice: [Seleziona]

.navigation {
margin-left: auto;
margin-right: auto;
display:table;
}

[adottauncane]

Metti poi [RISOLTO] davanti al titolo del primo post.

[giusebos]

Metti poi [RISOLTO] davanti al titolo del primo post.

se lo fa non ci credo nemmeno se lo vedo!!

[upload]

giusebos un attimo di pazienza sto testando questa soluzione per vedere come va!

[upload]

Non mi riesce di mettere risolto nel primo post