[cssdesign] elenchi e css (parte II)
Cooper
cooper a blueware.it
Mar 22 Nov 2005 12:13:36 CET
Ciao a tutti,
in riferimento al thread precedente, sono riuscito a risolvere il problema ma il risultato finale non è lo stesso.
Mi spiego meglio con questo esempio (lista verticale):
/* CSS */
ul#navlist { background: #efefef; margin-left: 0px; padding-left: 0px; white-space: nowrap; }
#navlist li { display: inline; list-style-type: none; }
#navlist a { display: block; background-color: #DDF5EB; border-bottom: 1px solid #003366; border-left: 1px solid #ffffff; border-right: 1px solid #003366; border-top: 1px solid #ffffff; color: #000099; font: 90% "Trebuchet MS", Arial, Helvetica, Sans-Serif; font-weight: 700; letter-spacing: 0.04em; margin: 2px auto; padding: .2em; text-decoration: none; width: 150px; }
#navlist a:link, #navlist a:visited { color: #000099; font: 90% "Trebuchet MS", Arial, Helvetica, Sans-Serif; font-weight: 700; text-decoration: none; }
#navlist a:hover { background:#fffdc8; border-bottom: 1px solid #ffffff; border-left: 1px solid #003366; border-right: 1px solid #ffffff; border-top: 1px solid #003366; color: #000099; font: 90% "Trebuchet MS", Arial, Helvetica, Sans-Serif; font-weight: 700; text-decoration: none; }
/* HTML */
<ul id="navlist">
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
La visualizzazione è corretta, se provo invece a togliere il "display:block" da "#navlist a" la lista appare in orizzontale, ma non nello stesso modo in cui appariva in verticale. L'aspetto grafico per intenderci non viene più mantenuto.
A questo punto chiedo, quali correzioni devo apportare affinchè l'aspetto grafico che si ha nella visualizzazione in verticale, coincida esattamente con quello orizzontale?
Grazie in anticipo per la risposta,
Cooper.
www.blueware.it
-------------- parte successiva --------------
Un allegato HTML è stato rimosso...
URL: http://itlists.org/pipermail/cssdesign/attachments/20051122/66718d4f/attachment.htm
Maggiori informazioni sulla lista
cssdesign