prendendo spunto da un lavoro realizzato da un utente del sito, ho deciso che per la home del mio sito ci sia unmenu tipo apple, solo in verticale anziche in orizzontale: il mio problema e che non riesco a metterlo verticale con allineamento a sinistra, come devo fare?
il sito e questo http://lasezionez.altervista.org/prova.html
grazie e buon natale
Via il float dalle voci elenco a cui darai un display:block e dimensioni precise. Il css può essere notevolmente semplificato:
Aggiungi un Doctype al documento e correggi anche gli errori nella tabella col formcodice:* {margin:0; padding:0} div#menu {width:105px;} div#menu ul{list-style-type:none;} div#menu li{display:block; width:105px; height:37px;} div#menu a{display:block; width:105px; height:37px;font-size:0px;background-image: url(/immagini/globalnavbg0225.png); background-repeat:no-repeat;} div#menu li.home a:link {background-position:0 0} div#menu li.home a:visited {background-position:0px -118px;} div#menu li.home a:hover {background-position:0px -38px;} div#menu li.home a:active {background-position:0px -76px;} div#menu li.store a:link {background-position:-104px 0px;} div#menu li.store a:visited {background-position:-103px -118px;} div#menu li.store a:hover {background-position:-104px -37px;} div#menu li.store a:active {background-position:-103px -76px;} /* e di seguito tutte le impostazioni per il background-position sugli altri link */
ora con firefox me li visualizza in diagonale, con ie me li visualizza in verticale ma solo con il simbolo della mela, e poi c'è anche un fastidioso trattino blu in alto a destra di ogni immagine
1. fai un aggiorna della pagina, stai ancora guardando la versione precedente;
2. rispetta le coordinate dello sfondo con ogni link (hai inserito sempre le stesse);
3. aggiungi il Doctype;
4. Elimina il
dopo ogni voce elenco
cosa significa
2. rispetta le coordinate dello sfondo con ogni link (hai inserito sempre le stesse);
?
puoi spiegare meglio o scrivermi il codice?
Attualmente la pagina non si vede per problemi con gli apici nel Doctype che, se vuoi usare html transitional, sarà
quanto al menu, credo userai poi un'altra immagine come sfondo dei link che saranno pure altri, comunque devi rifarti alle coordinate originali, che permettono di visualizzare una porzione diversa dello sfondo sui diversi link e coi diversi stati, mentre modificando hai copiato e incollato le stesse coordinate e quindi visualizzi sempre la stessa parte dell'immaginecodice:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
per i primi due link puoi guardare nell'esempio che avevo riportato, gli altri puoi riprenderli dalla tua versione precedente del csscodice:div#menu li.home a:link {background-position:0 0 } div#menu li.home a:visited {background-position:0px -118px ;} div#menu li.home a:hover {background-position:0px -38px ;} div#menu li.home a:active {background-position:0px -76px ;} div#menu li.store a:link {background-position:0 0} div#menu li.store a:visited {background-position:0px -118px;} div#menu li.store a:hover {background-position:0px -38px;} div#menu li.store a:active {background-position:0px -76px;}
Permessi di invio
Rispondi quotando