Forum di Matriz

Versione completa: allineamento menu
Al momento stai visualizzando i contenuti in una versione ridotta. Visualizza la versione completa e formattata.
Ciao Mattia, ti scrivo poichè ho qualche problema nell'allineamento del menu di questa pagina:

http://www.cadutaponies.altervista.org/ossoli/intro.php

in realtà la pagina col menu è menu.php

come vedi le voci del menu sono sballate e non riesco a farle rientrare nel menu che è situato al centro...

Come si può sistemare??

Saluti
Per prima cosa cancella nel file "menu.php" questo (perché c'è già nel tag head anche se sarebbe più corretto mettere tutto in un file CSS esterno, così come tutti i parametri "style" che utilizzi):
Codice:
<style type="text/css">
    .menuLink{
        color: #FFF;
        font-weight: bold;
        font-size: 10pt;
        font-family: 'Trebuchet MS';
        text-decoration: none;
        font-style: italic;
    }
    </style>

Per allineare al centro dovresti creare un div che conterrà tutta la pagina e che avrà come sfondo l'immagine della macchina. Questo div dovrà essere largo 1024 pixel (come l'immagine) e sarà centrato.
A questo punto ti basterà mettere tutto il contenuto del sito dentro a questo div e sarà sempre centrato.

Ho modificato il codice per come dovrebbe essere (non l'ho testato ma mi pare corretto):
Codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="it" lang="it">
<head>
<title> Ossoli </title>
<style type="text/css">
body{
    background-color: #000;
    margin-top: -0; margin-left: -0; margin-right: -0; margin-bottom: -0;
}
#container{
    margin: 0 auto;
    width: 1024px;
    height: 640px;
    background: url(img/home.jpg) no-repeat top center;
}
#menu{
    background: #000 url(img/menu.jpg) no-repeat top center;
    width: 100%;
    height: 46px;
}
#menu a{
    color: #FFF;
    font-weight: bold;
    font-size: 10pt;
    font-family: 'Trebuchet MS';
    text-decoration: none;
    font-style: italic;
}
</style>
</head>
<body>
<div id="container">
    <table id="menu">
        <tr>
            <td style="width: 3%;"></td>
            <td style="width: 5%;"><a href="intro.php">Home</a></td>
            <td style="width: 6%;"><a href="models.php">Models</a></td>
            <td style="width: 7%;"><a href="carbonio.php">Carbonio</a></td>
            <td style="width: 8%;"><a href="passaporto.php">Passaporto</a></td>
            <td style="width: 8%;"><a href="distributori.php">Distributori</a></td>
            <td style="width: 9%;"><a href="ossolife.php">Ossolifestyle</a></td>
            <td>&nbsp;</td>
            <td style="width: 7%;"><a href="contatti.php">Contatti</a></td>
        </tr>
    </table>
</div>
</body>
</html>

Si potrebbe ulteriormente migliorare mettendo tutto il CSS in un file esterno e utilizzando un ul al posto della tabella per creare il menù.
Ciao MAttia, il problema è che adesso mi sposta sia l'img della macchina che quella del menu con relative voci a sinistra!!
Inoltre per com'è impostato adeso, prende il file home.jpg per tutte le pagine...invece prima per ogni pagina c'era una img diversa (contact.jpg per contatti, models.jpg per Models e così via) che sono già impostate nelle rispettive pagine .php

p.s. ho provato a rimuovere solo #container ma mi torna alla situazione iniziale
Il problema è che il codice che ti ho dato io non va nel file "menu.php", ma deve essere il risultato finale dell'unione dei file che formano la pagina.
Ok, per adesso credo di averlo sistemato in maniera "decente"...grazie mille per le dritte...se ho problemi scrivo sempre in queso post

Saluti
OK, prego!