La sezione link partner nella home page di Mytom aveva bisogno di un deciso restyling, visto che era organizzata in un insieme di link confuso e senza nessuna formattazione.
Per ovviare a tale lacuna, Mytom ha deciso di rimettere tutto apposto ricorrendo ai CSS, d' altra parte tutto il sito è costruito con Cascade Syle Sheet.
Il primo passo è stato richiudere i link in un nuovo contenitore (i valori, d'ora in avanti, sono indicativi):
#link_partner {height: 120px}
Abbiamo dato così un' altezza fissa al contenitore. Successivamente abbiamo impostato un formato al tag "a" da inserire allinterno del contenitore.
#link_partner a {float: left; width: 290px; display: block; text-decoration:none; color: #396594; font-size: 12px; text-align: center;}
Dei valori sopra indicati è bene soffermasi sui seguenti:
- float: left; fa in modo che ogni link si disponga alla destra di quello precedente (left vuol dire che è mobile a sinistra)
- display: block; indica che il link deve avere la larghezza fissa dichiarata con width e deve comparire per intero come, appunto, un blocco.
- text-decoration: none; infine non fa comparire la linea sotto il link
Il risultato lo potete vedere voi stessi in home page, e tutto questo senza ricorrere alla solita tabella fatta di righe, colonne, allineamenti, dimensioni fisse ecc. ecc.
lunedì 7 aprile 2008
Incolonnare i link con i CSS
Iscriviti a:
Commenti sul post (Atom)
Nessun commento:
Posta un commento