Newsgroup: it.comp.www.html
Titolo: menu css

Ciao,
sto cercando di imparare a realizzare un menu css.
Ho un problema... chi ne ha voglia può guardare alla pagina:
http://www.blackstudio.it/test/prova.htm
e aiutarmi a capire perchè l'effetto rollover non si estende su tutto il
blocco, ma rispetta il padding del testo.
Il css è nel file, quindi lo vedete dall'HTML.
Grazie!!!
--
Voyager


Prova a inserire:
width:144px;
in
div.menu a{...............}
e
div.menu a:hover{...............}
vedi se ti piace cosě.
--------------------------------
Inviato via 
http://usenet.libero.it

 
http://www.blackstudio.it/test/prova.htm
io tagliando la testa al toro metterei il padding di 5px
dentro a e a:hover e cosě ottieni quel che ti serve
-- 
[ Fustino? What a F#*k1n6 nick!? ]
  ~ 
http://space.virgilio.it/swa...@tin.it
  ~ ICQ: 61670579

 vedi se ti piace cosě.
Uhm... preferisco l'effetto pulsante "intero"...
Grazie comunque...
-
Voyager

 blocco, ma rispetta il padding del testo.
Ciao, sperando di farti cosa gradita ti ho sistemato il problema:
<style type="text/css">
<!--
div.menu
{
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 12px;
        display: block;
        background-color: #FFCC00;
        border-top-width: 1px;
        border-right-width: 1px;
        border-bottom-width: 1px;
        border-left-width: 1px;
        border-top-style: solid;
        border-right-style: solid;
        border-bottom-style: solid;
        border-left-style: solid;
        border-top-color: #FFFFFF;
        border-right-color: #FF6600;
        border-bottom-color: #FF6600;
        border-left-color: #FF6600;
        padding-left: 0px;
        text-indent: 5px;
}
div.menu a {
        text-decoration: none;
        color: #000000;
        display: block;
}
div.menu a:hover {
        text-decoration: none;
        color: #FF0000;
        background-color: #FFFF00;
        display: block;
}
-->
</style>
Emiliano Farinella
-- 
"Science as a candle in the dark" -- Carl Sagan

 io tagliando la testa al toro metterei il padding di 5px
E' proprio l'uso del padding che e' concettualmente sbagliato.
Deve essere inserita un'indentatura, non un padding, IMO.
Il codice e' nell'altro post
Ciao,


 Il codice e' nell'altro post
già non hai tutti i torti :D


 Ciao, sperando di farti cosa gradita ti ho sistemato il problema:
[...]
Ah! Ho capito, quindi è necessario mettere l'indentatura del testo e
togliere il padding!
Ti ringrazio davvero, sei stato gentilissimo!
Grazie!!
-
Voyager

 Ti ringrazio davvero, sei stato gentilissimo!
Figurati! A domanda seria ("sto cercando di imparare"), e' doveroso dar
seguito con risposta seria, nell'ambito delle disponibilita'.


 "Science as a candle in the dark" -- Carl Sagan
Scusa se mi intrometto, su IE vedo che cambia colore al primo link entrando
nell'area, agli altri solo sul testo.
Naturalmente questo è perché solo il primo ha le dimensioni settate in td,
giusto?
Un Tafano che fa anche domande sceme per imparare :)

         display: block;
Il tag block come funziona sotto windows e Linux nelle varie versioni di
IE, Netscape, Opera, ecc?
Per alcune cose puo' essere una scelta piu' robusta dei fogli di stile
applicati alle tabelle?
Emiliano Farinella
-- 
http://www.emiliano.farinella.org

 giusto?
Sorry, sotto IE5 per OSX funziona correttamente 
Non so sotto win :-(


 Un Tafano che fa anche domande sceme per imparare :)
Uhm... credo di non avere capito a cosa ti riferisci...
Puoi spiegarti meglio?
-
Voyager


Dunque, ho fatto delle prove con pixel, percentuale e niente.
Ho le mie brave cellette con uno due tre e quattro per i link come da prova
di Voyager.
Con le dimensioni impostate sia alla prima cella sia in tutte e quattro ho
lo stesso comportamento: quando il mouse va sulla prima cella entra in
azione il div.menu a:hover, sia che il mouse "tocchi" il testo sia che non
lo tocchi.
Nelle altre celle, invece, il div.menu a:hover si attiva solo ed
esclusivamente quando tocco il testo, se entro nella cella e basta non fa
nulla. Anche impostando il td width a tutte le celle.
Questo mi succede con IE 6 (installate in automatico tutte le patch), non ho
altri browser attualmente, metterò Mozilla appena avrò un momento.
E' questo il comportamento che non mi spiego, o meglio, che vorrei evitare.
Non trovo spiegazioni logiche che non siano un bug di IE.
Qualcuno mi può chiarire le idee su questa cosa? Ed anche magari come fare
per ottenere un risultato migliore?
Grazie :)
(scusate il ritardo)

 blocco, ma rispetta il padding del testo.
ricordo un lungo thread sul NG riguardo questo problema,
non sono riuscito a trovarlo su google groups (non ricordo
ne titolo, ne autori...)
se qualcuno riesce a recuprare quel thread chiudiamo
la partita.
ciao.
-- 
email: goldicus1970 AT 
yahoo.it
web: 
http://www.deelan.com