Ciao a tutti!
È il mio primo post su questo forum, spero di riuscire a essere chiaro....![]()
![]()
![]()
Dunque: mi sono imbattuto in un problema di gestione dello sfondo in un menu di navigazione verticale, a larghezza fissa, contenuto all'interno di un <div> liquido.
Questo menu non è altro che una semplice lista <ul> trattata come elemento blocco, a cui sono applicati i seguenti marcatori (tralascio del tutto i font che per ora non centrano):
Lo sfondo è un semplice pattern (w: 15px - h: 1px) che, ripetendosi verticalmente, genera un "tubo" che percorre il menu, sul lato sinistro, incrociandosi ai pallini che costituiscono i "bullet" del menu stesso.codice:/* STILE PER <UL> */ ul#menu { padding:0; margin:0; display:block; position:absolute; top:0; left:0; list-style:none; width:160px; text-align:left; background:white url(tubo.gif) top left repeat-y; } /* STILE PER <LI> */ ul#menu li { list-style-image: url(pallino.gif); }
PRIMO PROBLEMA
Per non so quale ragione, l'intero <ul> veniva spostato a sinistra, così che i pallini-bullet fuoriuscissero dal <div> contenitore, in modo da allineare le voci del menu (anziché i pallini) all'effettivo margine sinistro del <div>.
Ho rimediato con ul#menu {margin-left:23px}, questo ha centrato i pallini rispetto al tubo, ma ha generato il...
SECONDO PROBLEMA
A questo punto, se centro i bullet spostando <ul> più a destra, anche il tubo (che è sfondo di <ul> viene spostato a destra; così, tubo.gif non si appoggia più al lato sinistro assoluto del <ul>, ma dal punto da cui partono i[*]; in sostanza, il tubo viene allineato alle voci del menu, non ai pallini-bullet come invece dovrebbe.
Aiuto!!!! Che fare??

Rispondi quotando
