Visualizzazione dei risultati da 1 a 4 su 4
  1. #1
    Utente di HTML.it
    Registrato dal
    Sep 2005
    Messaggi
    282

    centrare il testo nei box di navigazione

    Ciao,
    ho un menù di navigazione nel quale è inserito un testo: non riesco a centrarlo! pur inserendo nel css text-aling:center mi risulta sempre allineato a sinistra!
    In cosa sbaglio?
    Grazie

    questo è il menù:

    <div id="nav">
    <ul id="nav">
    <li id="active">home
    [*]chi siamo
    [*]altro
    [*]ecc
    [*]contatti
    [/list]
    </div>


    e questo è il css:

    div#nav{
    position:relative;
    width: 650px;
    height: 120px;
    font: 90%/1.5 Verdana,Arial,sans-serif;
    margin:auto;
    }

    ul#nav{float: left;
    width: 100%;
    list-style: none;
    text-align:center;
    margin: 0;
    padding: 0
    }

    ul#nav li{float: left;
    width: 12%;
    background-color:#eeeeee;
    margin: 0 0.1em 0;
    padding: 0 0 0 4px;
    border:solid;
    border-width: 1px;
    }

    ul#nav a{float: left;
    padding: 0.4em 8px 0.4em 0;
    color:#6D97E2;
    }

    ul#nav a:hover{color: #ff0000}

    ul#nav li#active{color: #0044ff}

  2. #2
    Utente di HTML.it
    Registrato dal
    Sep 2005
    Messaggi
    282
    Facendo alcune prove ho risolto il problema e posto la mia soluzione per qualcuno che in futuro ne avesse bisogno. Premetto però che non mi piace come soluzione e chiedo agli esperti se esiste qualche soluzione migliore.

    La modifica che ho apportato è la seguente:

    ul#nav a{float: left;
    padding: 0.4em 8px 0.4em 0;
    color:#6D97E2;
    display:block;
    width: 100%;
    }

    in sostanza ho aggiunto display:block e width:100%

    In realtà non capisco perchè aveva bisogno del width....

  3. #3
    Utente di HTML.it
    Registrato dal
    Sep 2001
    Messaggi
    21,188
    Anzitutto attenzione alla sintassi. Non si possono usare due oggetto con lo stesso id nella stessa pagina.
    la classe puo` essere ripetuta, ma l'id no.

    Comunque il tag <a> di default e` di tipo inline, quindi non ha una sua dimensione e non si puo` dargliela.
    Quindi al suo interno il text-align non ha significato.

    Quando lo rendi block, puoi dargli la dimensione, ma di default tale dimensione e` la piu` piccola possibile in base al contenuto, eccoperche` e` necessario anceh il width.

    Invece non e` necessario che il tag <a> sia flottato, ma forse lo hai messo per rendere tutto float, e non aver bisogno di alcuni clear.
    Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
    No domande tecniche in messaggi privati

  4. #4
    Utente di HTML.it
    Registrato dal
    Sep 2005
    Messaggi
    282
    Grazie per avermi fatto capire qualcosa.
    Ciao

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2026 vBulletin Solutions, Inc. All rights reserved.