- Home
- Categorie
- Coding e Sistemistica
- HTML e CSS
- liste orizzontali
-
liste orizzontali
salve a tutti... mi vergogno un po' per il fatto che sono sempre qui a chiedervi qualcosa... anche questa volta mi sono scervellato ma non sono riuscito a risolvere i miei problemi da solo.
Vengo al dunque.
Vorrei inserire sul mio sito due menu in orizzontale. Ho letto molti tutorial sul tema, quindi ho creato per uno un css di questo tipo:div#menu {
margin-right:5px;
float: right;
text-align: right;
background-color: #A1BAAB;
height:1.3em;
}
div#menu li{
display: inline;
margin: 0;
padding: 0;
list-style-type: none;
}
e per l'altro, inserito all'interno della pagina, questo:
.inline li{
display: inline;
border-right:2px #133156 solid;
padding: 0 5px;
list-style-type: none;
} funzionano tutti e due, ma mi danno alcuni problemi... ecco gli screenshots che fanno meglio delle parole:
la prima, relativa al primo problema. Il menu sparisce. Non posso aumentare l'altezza del div che lo contiene perché mi fa abbassare tutto, ma non riesco ad eliminare lo spazio inutile che mi aggiunge sopra e sotto i link... che fare?(la zona del menu è quella verdina in alto a destra)
il secondo relativo all'altro problema... essendo una lista non ordinata, mi inserisce il menu rientrato rispetto al testo, mentre io vorrei che fosse affiancato a benvenuto, federico.
ancora una volta... grazie a tutti...
-
miticuzzo... mi è venuta un'idea per risolvere il secondo problema. ho assegnato al paragrafo di "benvenuto, federico" la classe .inline per cui mi inserisce tutto sulla stessa linea...
però mi chiedo perché, sebbene siano all'interno dello stesso paragrafo, io debba assegnare la classe inline anche a ul`, altrimenti non funziona. è perché il paragrafo non è un elemento di blocco?
-
ma porc... proprio non riesco a risolvere la questione lista orizzontale!! sebbene io metta ovunque nel css padding:0, se metto una lista mi aggiunge un sacco di spazio sopra e sotto di essa... ho anche provato a non inserire quel menu in un div, ma la solfa non cambia, mi aggiunge un orrendo padding e mi fa scendere tutto lo header. io non so più che pesci prendere!! non voglio rinunciare alla lista, accidenti. Oltretutto, anche senza lista non è che sia così gradevole... perché mai il bordo (che nel css è assegnato agli elementi ancore ) non comprende la sottolineatura del testo, e mi lascia quell'orrendo pixel verde?? grrrrrr... i css si fanno odiare!