Borde esterno ad un div

[Felino]

Salve utenti,
dovrei mettere un bordo esterno ad un div con la classe hover.

Avevo pensato ad associargli lo stile:

outline: 3px solid black;

fin qui tutto ok.

Ma se volessi il bordo solo in top e bottom come fare?

Grazie.

[carlomarangoni]

border-bottom: 3px solid black;
border-top: 3px solid black;

[Felino]

Ma così i bordi sono interni al div, no?

[Felino]

Il problema è che se mette utilizzo lo style border per dargli l'effetto hover, al passaggio del mouse il testo in esso contenuto fa sali e scendi!!!!
Vorrei che invece rimanesse fisso...

[Mich_]

La soluzione piu` semplice e` definire SEMPRE i bordi, cambiando colore al cambiare della situazione.


Ad esempio a riposo i bordi sono bianchi (oppure trasparenti), nella condizione :hover i bordi diventano colorati; la larghezza deve rimanere sempre la stessa.

Nota: i bordi sono sempre esterni al blocco (definito da width e height) - solo in IE (quirks mode) i bordi sono interni. Invece se usi una DTD strict, anche IE si comporta in modo standard.

[Felino]

Giusto, ottima soluzione.
Farli bianchi e poi al passaggio cambiano colore.
Per farli trasparenti? Come posso procede?

[Mich_]

Il transparent si usa come un normale colore, ma non e` supportato da tutti i browser (o almeno non lo era qualche anno fa).

Quindi si dovrebbe programmare cosi`:

  ... altre caratteristiche dei bordi ...
  border: white;
  border: transparent;

[Felino]

Grazie, provo e ti farò sapere!