Modo discussione | Modo lineare

Chandler · 05-03-2010, 20:07

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

***Mattia***

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ù.

Chandler · 06-03-2010, 16:35

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

***Mattia*** · 06-03-2010, 16:42

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.

Chandler · 06-03-2010, 17:45

Ok, per adesso credo di averlo sistemato in maniera "decente"...grazie mille per le dritte...se ho problemi scrivo sempre in queso post

Saluti

***Mattia*** · 07-03-2010, 11:46

OK, prego!