allineare le voci del menu con stile (Css)

bella · 15 Mar 2006

Salve, sto impazzendo nel trovare una soluzione a questo problema.
Nel menu' BLU in altro della mia pagina http://www.italianrugby.net/index.php non riesco a centrare le voci: ovvero vorrei che le 7 voci del menu superiore occupassero "lo stesso spazio" delle 7 voci del menu inferiore, e che di conseguenza fossero allineate come colonne, ma ho invece utilizzato le funzionalita' CSS (poiche' vorrei evitare di inserire tabelle).

Il semplice codice che ho utilizzato per creare questo menu e' il seguente:

<div id="MENU">
<a class="MENU" href="http://www.italianrugby.net/index.php">HOME</a>
<a class="MENU" href="http://www.italianrugby.net/news/news.php">NEWS</a>
<a class="MENU" href="http://www.italianrugby.net/articoli/articoli.php">ARTICOLI</a>
<a class="MENU" href="http://www.italianrugby.net/classifiche/classifiche.htm">TORNEI</a>
<a class="MENU" href="http://www.italianrugby.net/union/union.htm">UNIONa15</a>
<a class="MENU" href="http://www.italianrugby.net/league/league.htm">LEAGUEa15</a>
<a class="MENU" href="http://www.italianrugby.net/sevens/sevens.htm">SEVENSa7</a>
<div>
<div id="MENU">
<a class="MENU" href="http://www.italianrugby.net/eventi/eventi.htm">EVENTI</a>
<a class="MENU" href="http://www.italianrugby.net/chat/chat.htm">CHAT</a>
<a class="MENU" href="http://www.italianrugby.net/forum/forum.htm">FORUM</a>
<a class="MENU" href="http://www.italianrugby.net/giochi/giochi.htm">GIOCHI</a>
<a class="MENU" href="http://www.italianrugby.net/varie/varie.htm">VARIE</a>
<a class="MENU" href="http://www.italianrugby.net/cerca/cerca.htm">CERCA</a>
<a class="MENU" href="http://www.italianrugby.net/scrivici/scrivici.htm">SCRIVICI</a>
</div>

Cosa posso fare ora, per "allineare" le voci del menu' con un perfetto stile estetico??? :cry:

sbobby · 15 Mar 2006

A me sembra che siano allineati...

dead · 15 Mar 2006

Prova cosi:

<head>
<style type="text/css"></style>
</head>

<body>
<div class="MEN1">
<a class="MENU" href="http://www.italianrugby.net/index.php">HOME</a>
<a class="MENU" href="http://www.italianrugby.net/news/news.php">NEWS</a>
<a class="MENU" href="http://www.italianrugby.net/articoli/articoli.php">ARTICOLI</a>
<a class="MENU" href="http://www.italianrugby.net/classifiche/classifiche.htm">TORNEI</a>
<a class="MENU" href="http://www.italianrugby.net/union/union.htm">UNIONa15</a>
<a class="MENU" href="http://www.italianrugby.net/league/league.htm">LEAGUEa15</a>
<a class="MENU" href="http://www.italianrugby.net/sevens/sevens.htm">SEVENSa7</a>
<div>
<br />
<div class="MEN1">
<a class="MENU" href="http://www.italianrugby.net/eventi/eventi.htm">EVENTI</a>
<a class="MENU" href="http://www.italianrugby.net/chat/chat.htm">CHAT</a>
<a class="MENU" href="http://www.italianrugby.net/forum/forum.htm">FORUM</a>
<a class="MENU" href="http://www.italianrugby.net/giochi/giochi.htm">GIOCHI</a>
<a class="MENU" href="http://www.italianrugby.net/varie/varie.htm">VARIE</a>
<a class="MENU" href="http://www.italianrugby.net/cerca/cerca.htm">CERCA</a>
<a class="MENU" href="http://www.italianrugby.net/scrivici/scrivici.htm">SCRIVICI</a>
</div>
</body>

p.s.
fra parentesi tieni conto che non è corretto
- usare lo stesso id per due elementi diversi
- usare lo stesso nome per due classi o id che hanno direttive differenti.

dead · 15 Mar 2006

cflsite ha scritto:
A me sembra che siano allineati...

eheh, tu stai usando quel zozzone di IExplorer.

con firefox non vengono allineati!

bella · 15 Mar 2006

dead ha scritto:
eheh, tu stai usando quel zozzone di IExplorer.
con firefox non vengono allineati!

eheh, pure io usero' quello zozzone di IExplorer!:fonzie:
Ho riscontrato alcuni problemi Dead con quel codice, ma ancora non mi si allinea. Continuero' a provare..ma grazie lo stesso!:beer:

sbobby · 20 Mar 2006

A me è venuta in mente un'altra idea, ma dovresti sostituire le scritte del menu con delle immagini: se ti crei delle immagini tutte della stessa misura, con scritto all'interno i vari nomi del menu (insomma devi creare dei tasti con quei nomi) poi puoi inserirli in una cosa del genere:

<div class="contenitore">
<div class="prima _linea_tasti>
<a href="./tuapagina.htm"><img class="tasti" src="./images/tasto1.JPG" alt="tasto1" /></a>
<a href="./tuapagina2.htm"><img class="tasti" src="./images/tasto2.JPG" alt="tasto2" /></a>
...e cosi via...
</div>
<div class="seconda_linea_tasti>
<a href="./tuapagin3.htm"><img class="tasti" src="./images/tasto3.JPG" alt="tasto3" /></a>
<a href="./tuapagina4.htm"><img class="tasti" src="./images/tasto3.JPG" alt="tasto3" /></a>
...e cosi via...
</div></div>

dove al class=tasti gli puoi dare un'uguale spaziatura e al class=contenitore puoi dare la grandezza che vuoi e l'allineamento che vuoi all'interno menu...Secondo me cosi si vede bene su qualsiasi browser...

bella · 20 Mar 2006

Bella e simpatica la tua idea cflsite di sostituire immagini al posto di testo nel menu'; giusto per valutare il tutto, sto pensando agli effetti positivi, ed effetti negativi.

Positivo, il fatto di avere una migliore grafica, con le immagini personalizzabili direttamente da una cartella "immagini tasti menu".
Positivo, il fatto di allineare il menu senza usare tabelle.

Negativo, il fatto di appesantire troppo le pagine, con 14 immagini jpg aggiuntive per ogni pagina?
Negativo, il fatto di non sfruttare in pieno le potenzialita' del CSS, esempio mouseover etc?

sbobby · 21 Mar 2006

Giustissima la tua analisi...In fin dei conti però sei crei delle immagini ottimizzate e con degli strumenti adatti potresti riuscire anche a farle grandi 2kb ciascuna quindi il sito non si appesantirebbe poi troppo!!! E' una scelta che devi fare te...Io nel mio sito ho optato per delle immagini perchè ne giova davvero tanto la grafica...Poi vedi tu!!!

bella · 23 Mar 2006

cflsite ha scritto:
Giustissima la tua analisi...

Con queste tue gentili parole, credo di potermi FINALMENTE appropriare del titolo di WebMaster:fonzie:
Grazie di cuore, ora tocca a me far scintille nel web:beer:

sbobby · 24 Mar 2006

Buona fortuna...Ricorda sempre di avere tanta pazienza e voglia di migliorarti!!!

Cerca

Cerca

allineare le voci del menu con stile (Css)

bella

Utente Attivo

sbobby

Utente Attivo

dead

Utente Attivo

dead

Utente Attivo

bella

Utente Attivo

sbobby

Utente Attivo

bella

Utente Attivo

sbobby

Utente Attivo

bella

Utente Attivo

sbobby

Utente Attivo

Discussioni simili