effetti su links

[blur]

devo risolvere questo fastidioso problema con i vari a:hover, a:link etc etc...

in una pagina ho un menu orizzontale, dei link nel body + due img e un email su pie pagina, tutte con una classe diversa.

questo è il link per vedere:link

l'ho testato con IE e firefox.
i problemi:

IE: le due img hanno il border-bottom visibile, come toglierlo?
anche l'email a pie di pagina, pur avendo creato una classe si comporta come i link del body.
firefox:
oltre agli stessi problemi di IE con firefox nel menu orizzontale mi visualizza il border-bottom..perchè, se anche qui ho una classe specificata?

il css:

menu orizz:

.bottone{
font-family: verdana, sans-serif, arial, impact, helvetica, Times New Roman ;
font-size:1em;
color:#004892;
border: solid 1px #BBB;
padding: 6px 30px 4px 30px;
width:80px;
margin: -3px;
text-decoration:none;
}

.bottone:hover{
border: solid 1px #ccc;
background:#fff;
color:#004892;
padding: 6px 30px 4px 30px;
text-decoration:underline;
cursor: pointer;
}

menu body:

a, a:link, a:active, a:visited {
text-decoration: none;
color:#0000ff;
border-bottom: Dashed 1px #0000ff;
}
a:hover {
text-decoration: none;
background:#333366;
color:#fff;
cursor: help;
border-bottom: Dashed 1px #fff;
}

link pie pagina :

.click:active {
text-decoration: none;
color:#0A6CCF;
border-bottom: none 0px;
}
.click:hover {
text-decoration: none;
color:#0A6CCF;
cursor: pointer;
}

[ZeroCool981]

allora per eliminare il border-bottom devi fare così.
al posto di usare:
border: solid 1px #ccc;
usa
border-left: 1px solid #ccc;
border-top: 1px solid #ccc;
border-right: 1px solid #ccc;

per il problema del link alla mail a piè di pagina prova specificando anche .click:link

[blur]

niente da fare così non funziona...neppure per il pie pagina e le immagini....

[blur]

up!
:rollo:

[Jerry Masslo]

per togliere un solo border il codice più semplice è:

border:1px solid gray;
border-bottom:0;

non ti funziona perché scrivi male le pseudo classi, se vuoi che tutti i link di un elemento facciano in un modo devi usare questo tipo di codice:

.bottone a
.bottone a:hover

ecc..

se vuoi assegnare direttamene una classe a un particolare link allora:

a.bottone
a.bottone:link

e al link <a class="bottone" ecc..

[blur]

Originariamente inviato da Jerry Masslo
per togliere un solo border il codice più semplice è:

border:1px solid gray;
border-bottom:0;

non ti funziona perché scrivi male le pseudo classi, se vuoi che tutti i link di un elemento facciano in un modo devi usare questo tipo di codice:

.bottone a
.bottone a:hover

ecc..

me è quello che ho fatto... :master:

.bottone a:link, .bottone a:active,.bottone a:visited {
font-family: verdana, sans-serif, arial, impact, helvetica, Times New Roman ;
font-size:1em;
color:#004892;
border-left: 1px solid #ccc;
border-top: 1px solid #ccc;
border-right: 1px solid #ccc;
padding: 6px 30px 4px 30px;
width:80px;
margin: -3px;
text-decoration:none;
}

.bottone:hover{
border: solid 1px #ccc;
background:#fff;
color:#004892;
padding: 6px 30px 4px 30px;
text-decoration:underline;
cursor: pointer;
}

poi lo richiamo con:

link

[Jerry Masslo]

.bottone:hover

nei codici che ti ho postato quello sopra ce lo vedi?


se fai .bottone a:link per esempio questo interesserà i link ad esempio di un <div class="bottone"> non altro

poi se vuoi distinguere solo l'hover dal resto il metodo più semplice è


a {...} /*interessa tutti gli stati se non diversamente specificato*/

a:hover {...}