Padding su menu verticale

[Sauron_x]

Ciao a tutti! Allora avrei due problemi.

Il primo:

Che padding posso dare al mio menu verticale affinchè abbia la riga tutta colorata per intero? In modo che passando con l'hover mi dia l'effetto desiderato.

Ho un pò giocherellato con il padding ma non ci riesco.

HTML

<div id="menusec">[img]images/menubg.png[/img]

    <ul>[*]

Oroscopo</p>[*]

News</p>[*]

My PC</p>[*]

Podcast</p>[*]

Upload</p>[*]

Streaming</p>[*]

Flash Games</p>[*]

Guide, Tutorial...</p>[/list]

</div>

CSS

#menusec {
    
    position: absolute;
    left: 75%;
    top: 20%;
}

#menusec ul {
    
    position: absolute;
    top: 2%;
    list-style: none;
    left: 5%;
}

#menusec li {
    
    display: block;
    height: 55px;
    
}

#menusec a {
    
    text-decoration: none;
    color: white;
    font-size: 20px;
    line-height: 2em;
}

#menusec a:hover {
    
    background-color: #292929;
}

#menusec p {
    
    text-align: center;
    position: relative;
    left: 50%;
}

Problema 2:

Ho messo il visited in modo che man mano che visito le pagine so dove mi trovo.

Il problema è che su IE 8 funziona, mentre su FF no.

CSS

#menu a:visited {
    
      background-color: #b20f0c;
    border-bottom: 5px solid #292929;
       -moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}

Grazie a tutti!

[Sauron_x]

nessuno?

[ResianTaxidrive]

il tag <a> è di tipo inline quindi devi assegnargli display:block con le dimensioni che ti interessano (anche width:100%; height:100%);

Per la seconda domanda potrebbe essere un problema di ordine nella dichiarazione delle pseudo-classi del link. L'ordine con cui le specifichi deve essere
:link
:visited
:hover
:active
potrebbe essere che tu dichiari prima :hover il quale va a sovrascrivere il :visited

[Sauron_x]

Grazie mille per la risposta.

A breve provo

[Sauron_x]

Ciao a tutti, riuppo questa discussione in quanto non ho risolto il mio problema.

Dunque, riguardo al menu tutto ok. Ci sono riuscito con display block.

Non riesci a far funzionare il visited però. Io in pratica vorrei che a seconda mi trovo il bottone rimanesse cliccato.

#menu ul {
    
    position: absolute;
    left: 40%;
    padding: 20px;
    list-style: none;
}

#menu li {
    
    display: inline;
    padding: 10px;
}

#menu a
                 {
    
    text-decoration: none;
    color: white;
    font-size: 20px;
    font-weight: bolder;
    line-height: 1.5em;
    text-align: center;
    padding: 5px 5px 5px 5px;
    opacity:.80;
filter:alpha(opacity=80);
filter:”alpha(opacity=80)”;

} 

#menu a:visited{
    
         background-color: #b20f0c;
    border-bottom: 5px solid #292929;
       -moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
box-shadow: 0 1px 3px rgba(0,0,0,0.5);    



}

#menu a:hover {
    
    background-color: #b20f0c;
    -moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}


#menusec ul {
    
    background-color: black;
    height: 380px;
    width: 250px;
    position: absolute;
    top: 30%;
    left: 62%;
}

#menusec ul li {
    
    list-style: none;
    display: block;
    height: 45px;
    border-bottom: 3px solid #222222;
    line-height: 2.5em;
    text-align: center;
    padding-top: 0;
}

#menusec a {
    
    text-decoration: none;
    color: white;
    font-size: 15px;
    text-align: center;
    display: block;
    padding-bottom: 5px;
    margin-top: 0px;
}

#menusec ul li:hover {
    
    border-bottom: 3px solid #b20f0c;
}

#menusec a:hover{
    
    background-color: #181818;
}

Posto il codice anche dell'altro menu che magari per qualche strano motivo mi va in conflitto.

L'ordine stavolta l'ho eseguito correttamente ma continua a non andare.


Ah, aggiungo che su IE va, mentre su firefox no.

Qualche idea?

[Sauron_x]

up

[Sauron_x]

Nessuno sa darmi una mano?

[Sauron_x]

up