Lien de div en div...

<link rel="stylesheet" type="text/css" href="style4.css" >

<div id="global">
<div id="entete">
<a href="index.html"><span class="espace1">Accueil</span></a>
<a href="presentation.html"><span class="espace2">Présentation</span></a>
<a href="reception.html"><span class="espace2">Salons de réception</span></a>
<a href="adresse.html"><span class="espace2">Adresse</span></a>
<a href="traiteur.html"><span class="espace2">Traiteur</span></a>
<a href="informations.html"><span class="espace2">Informations</span></a>
</div>

	<div id="centre">
        <div id="centre-bis">

<div id="navigation">
Réunion<br>
Séminaire<br>
Banquet<br>
Mariage<br>
communion<br>
Anniversaire<br>
Baptême<br>
Funérailles</div>

          <div id="secondaire">menu a voir</div>
          <div id="principal"></div>
        </div>
	</div>
	<div id="pied">lien facebook</div>
</div>

<?php
if(isset($_GET['p']) && !empty($_GET['p'])) {
    $p = htmlentities($_GET['p']);
     
    switch($p) {
        case 'Accueil': $principal = 'Contenu de la page "Accueil"';
        break;
        case 'Présentation': $principal = 'Contenu de la page "Présentation"';
        break;
        case 'Salons de réception': $principal = 'Contenu de la page "Salons de réception"';
        break;
        case 'contact': $principal = 'Contenu de la page "Adresse"';
        break;
	case 'Adresse': $principal = 'Contenu de la page "Traiteur"';
        break;
	case 'Informations': $principal = 'Contenu de la page "Informations"';
        break;
        default: $principal = 'Page inconnue';
        break;
    }
     
    echo $principal;
}
?>

$(document).ready(function() {
    var $principal_div = $('#principal div');
    var page = $('#nav li a:first').text(); // par défaut c'est Accueil
     
    // au clic sur un lien du menu
    $('#nav li a').on('click', function() {
        var url = $(this).attr('href'); // on récupère le href
         
        // on récupère le nom de la page demandée
        var pageDemandee = $(this).text();
 
        // si on appelle une page qui n est pas celle affichée
        if(pageDemandee != page) { 
         
            // on met en mémoire la page
            page = pageDemandee;
             
            // chargement dans la div
            $.ajax({
                url: url,
                cache: false,
                success: function(html) {
                    $principal_div.hide().html(html).fadeIn();
                }
            });
        }
        return false;
    });
});

.espace1{
  margin-left:1em
}

.espace2{
  margin-left:3em
}

/* Général */ 
body {
	color: #F0E39E;
	background: #EAECD6;
}

/* Navigation */
#navigation {
	color: #BECD32;
	background: #62584F;
	font-family: Gabriola;
	font-size: 25px;
}

/* Contenu principal */
#principal {
	color: #62584F;
	background: #EAECD6;
	font-family: Gabriola;
	font-size: 25px;
}

/* Contenu secondaire */
#secondaire {
	color: #BECD32;
	background: #62584F;
	font-family: Gabriola;
	font-size: 25px;
}

/* Entete */
#entete {
	color: #000000;
	background: #BECD32;
	font-family: Gabriola;
	font-size: 25px;
}

/* Pied */
#pied {
	color: #000000;
	background: #BECD32;
	font-family: Gabriola;
	font-size: 25px;
}




/* --- POSITIONNEMENT --- */

/* Page */
body {
	padding: 60px 310px;
}
#global {
	width: 90%;
	max-width: 90em;
	min-width: 1022px;
	margin-left: auto;
	margin-right: auto;
}

/* En-tête */
#entete {
	height: 40px;
	padding-top: 0px;
	padding-bottom: 10px;
}


/* Bloc central */
#centre-bis {
	width: 100%;
	overflow: hidden;
}

/* Menu de navigation */
#navigation {
	float: left;
	width: 178px;
	height: 450px;
	padding-top: 20px;
	padding-bottom: 5px;
	padding-left: 30px;
}

/* Contenu principal */
#principal {
	margin-left: 220px;
	margin-right: 260px;
	padding-top: 20px;
	padding-bottom: 5px;
}

/* Contenu secondaire */
#secondaire {
	float: right;
	width: 208px;
	height: 450px;
	padding-top: 20px;
	padding-bottom: 5px;
}

/* Pied de page */
#pied {
	margin: 0;
	height: 40px;
	padding-top: 0px;
	padding-bottom: 10px;
}