Je voudrais construire un site moi même
Je me suis remis sur des tutos mais j'ai des difficultés sur plusieurs points, dans un fichier css j'ai mis du code où je voudrais mettre le header en haut, centré, le menu (content) à 150 px gauche sous header, le menu (contenu) à droite du menu (content), le tout centré avec le footer en bas.
Je voudrais aussi que le menu se répète sur toutes les pages ( index, la race, nos chatons, ) et qu'il y ait seulement le contenu qui change et qui s'ouvre sur chaque pages.
Mais la je craque
je vous met le code
index
<!doctype html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Africat Savannah</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="styl.css" rel="stylesheet" type="text/css">
<style type="text/css">
body {
margin-left: 0px;
}
</style>
<div id="header">
</div>
<div id="main">
<div id="content">
</div>
<div id="contenu">
</div>
</div>
<div id="footer">
</div>
<body>
<div class="header" >
<?php
include('header.php'); // Nous appelons l'entete du site
?>
</div>
<div class="content" >
<?php
include('content.php'); // Nous appelons notre content
?>
</div>
<div class="contenu" >
<?php
include('contenu.php'); // Nous appelons le contenu du site
?>
</div>
<div class="footer">
<?php
include('footer.php'); // Nous appelons le pied de page
?>
</div>
</body>
</html>
le contenu<!doctype html>
<html>
<nav id="contenu">
<div class="contenu">
</div>
<contenu id="contenu">
</contenu>
</nav>
<head>
<meta>
<title>Africat Savannah</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</style>
<style type="text/css">
body,td,th {
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
font-style: normal;
font-weight: normal;
font-size: 14px;
color: #070707;
}
body {
background-color: #FDFDFD;
background-repeat: no-repeat;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
a {
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
font-style: normal;
font-weight: normal;
font-size: 14px;
color: #070707;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #2A2727;
}
a:hover {
text-decoration: none;
color: #2565BB;
}
a:active {
text-decoration: none;
color: #070707;
}
h1,h2,h3,h4,h5,h6 {
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
font-style: italic;
font-weight: bold;
}
h1 {
font-size: 14px;
color: #070707;
}
h2 {
font-size: 16px;
color: #070707;
}
h3 {
font-size: 18px;
color: #070707;
}
h4 {
font-size: 24px;
color: #070707;
}
</style>
<body tracingsrc="vrac/Site 03.jpg" tracingopacity="100">
<ul>
<table width="745" height="901" border="0">
<tbody>
<tr>
<th width="585" height="897" align="left" valign="top" scope="row"><table width="488" height="122" border="0">
<tbody>
<tr>
<th width="102" height="118" scope="row"> </th>
<th width="376" align="left" scope="row"><table width="256" border="0">
<tbody>
<tr>
<th width="246" height="110" align="left" valign="top" scope="row"><img src="vrac/Index.gif" width="250" height="106" alt=""/></th>
</tr>
</tbody>
</table></th>
</tr>
</tbody>
</table>
<span style="color: #2C68BB; font-style: italic; font-size: 24px;"><img src="vrac/tete_chat.gif" width="19" height="25" alt=""/> <span style="font-weight: bold">Un élevage dans un cadre familiale</span></span><br>
<br>
<span style="font-weight: normal">Situé à Nice dans le PACA,</span> <em style="color: #2C68BB; font-weight: bold;">AFRICAT SAVANNAH</em> <span style="font-weight: normal">est un élevage professionnel de chats Savannah.<br>
Nous sommes
les seuls éleveurs dans tous les alpes maritimes. <br>
Nos chatons Savannah sont élevés et vendus dans le respect intégral des règlementations européennes et du bien-être de l'animal.<br>
<br>
Nos chatons et parents visibles sur rendez-vous, exclusivement, notre programme d'élevage est axé sur l'amélioration de la race et nous permet de proposer des chatons savannah avec un potentiel génétique issu de souches exceptionnelles les grands parents de nos chatons son nés aux USA, provenant de l'élevage de réputation mondiale <a href="http://xxxxx.com/" target="_blank">SELECT EXOTICS</a>, l'un des <!-- #BeginLibraryItem "/Library/Sanstitre.lbi" -->p<!-- #EndLibraryItem -->lus anciens élevages à la base de la création de la race Savannah. </span>
<p> <span style="font-weight: normal">Pour mieux connaître notre élevage, consulter la rubrique <a href="la_maison_des_savannahs.htm">la maison des Savannah.</a></span></p>
<span style="font-weight: normal"> Les diplômes et autorisations nous permettant d'exercer notre activité. </span>
<p style="font-weight: normal"> Ce site vous permettra de faire connaissance avec ce félin hybride d'une rare beauté et très attachant. </p>
<span style="font-weight: normal"> Quelles sont ses origines, ses spécificités physiques et comportement. </span>
<p style="font-weight: normal">Savez-vous par exemple que le Savannah est <strong><a href="https://fr.wiktionary.org/wiki/hypoallerg%C3%A9nique" target="_blank">hypoallergénique</a></strong>, il aime l'eau et il est très joueur. </p>
<p style="font-weight: normal"> Vous apprendrez ce qu'il faut savoir pour élever un Savannah sur notre site, quels sont ses besoins, quels soins lui apporter et si vous avez une question n'hésitez pas à prendre contact avec nous au 06 68 52 00 00 ou [email protected]. </p>
<p> <span style="font-weight: normal">pour définir un F1, F2 sa classification et la description du Savannah ce lien <a href="léxique.htm">léxique</a> vous aidera à mieux comprendre comment le Savannah a évolué. <br>
</span><br>
<span style="font-weight: normal">Certificat de capacité 06150</span><br>
<span style="font-weight: normal">chatterie n°15 3 9258<br>
Africat Savannah LOOF n°22063<br>
chats testés FELV/FIV/PIF négatif</span></p></th>
<td width="150" align="left" valign="top"><img src="Image_pour_le_site/chat_savannah_pepetite_grande/image réduite/PA100008.jpg" width="240" height="320" alt=""/><br>
<br>
<br>
<br><img src="Image_pour_le_site/chat_savannah_pepetite_grande/image réduite/P9220007.jpg" width="240" height="180" alt=""/><br>
<br>
<br>
<br>
<img src="Image_pour_le_site/chat_savannah_pepetite_grande/image réduite/P9300009.jpg" width="240" height="180" alt=""/></td>
</tr>
</tbody>
</table>
</body>
</html>
</ul>
Le stile css#header, #content, #contenu, #footer {
padding:1px 0;
}
#header {
background-color: #FDFDFD;
text-align: center;
}
#main {
max-height:960;
margin:auto;
position:relative;
}
#content {
float:left;
width:100px;
position: absolute;
}
#contenu {
margin-left:103px;
min-height:150;
}
#footer {
background-color:#FDFDFD;
text-align:center;
}#main {
}
html,body,td,th {
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
font-style: normal;
font-weight: normal;
font-size: 14px;
color: #070707;
}
body {
background-color: #FDFDFD;
background-repeat: no-repeat;
margin-left: 250px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
a {
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
font-style: normal;
font-weight: normal;
font-size: 14px;
color: #070707;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #2A2727;
}
a:hover {
text-decoration: none;
color: #2565BB;
}
a:active {
text-decoration: none;
color: #070707;
}
h1,h2,h3,h4,h5,h6 {
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
font-style: italic;
font-weight: bold;
}
h1 {
font-size: 14px;
color: #070707;
}
h2 {
font-size: 16px;
color: #070707;
}
h3 {
font-size: 18px;
color: #070707;
}
h4 {
font-size: 24px;
color: #070707;
}
La ces ma page header<!doctype html>
<html>
<nav id="header">
<div class="header">
</div>
<header id="header">
</header>
</nav>
<head>
<meta>
<title>Africat Savannah</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="styl.css" rel="stylesheet" type="text/css">
<style type="text/css">
body {
margin-left: 0px;
}
</style>
<body>
<!-- Save for Web Slices (Site_savannah entier.psd) -->
<table id="Tableau_01" width="1025" height="389" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="2" rowspan="2">
<img src="images/header_01.jpg" width="173" height="143" alt=""></td>
<td colspan="7"><a href="index.php"><img src="images/header_02.jpg" width="735" height="126" alt=""></a></td>
<td colspan="4" rowspan="5">
<img src="images/header_03.jpg" width="116" height="357" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="126" alt=""></td>
</tr>
<tr>
<td colspan="7">
<img src="images/header_04.jpg" width="735" height="17" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="17" alt=""></td>
</tr>
<tr>
<td rowspan="5">
<img src="images/header_05.jpg" width="15" height="245" alt=""></td>
<td colspan="4">
<img src="images/header_06.jpg" width="295" height="182" alt=""></td>
<td colspan="4" rowspan="2">
<img src="images/header_07.jpg" width="598" height="198" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="182" alt=""></td>
</tr>
<tr>
<td colspan="4">
<img src="images/header_08.jpg" width="295" height="16" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="16" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="3">
<img src="images/header_09.jpg" width="208" height="47" alt=""></td>
<td rowspan="2"><a href="galerie.html"><img src="images/header_10.jpg" width="76" height="31" alt=""></a></td>
<td colspan="2" rowspan="2"><a href="la_maison_des_savannahs.php"><img src="images/header_11.jpg" width="233" height="31" alt=""></a></td>
<td rowspan="2"><a href="reproduction.php"><img src="images/header_12.jpg" width="136" height="31" alt=""></a></td>
<td rowspan="2"><a href="Information.php"><img src="images/header_13.jpg" width="144" height="31" alt=""></a></td>
<td rowspan="3">
<img src="images/header_14.jpg" width="96" height="47" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="16" alt=""></td>
</tr>
<tr>
<td rowspan="2">
<img src="images/header_15.jpg" width="27" height="31" alt=""></td>
<td rowspan="2"><a href="index.php"><img src="vrac/Fr.jpg" width="28" height="28" alt=""></a></td>
<td rowspan="2"><a href="Index_ag.php"><img src="vrac/Ang.jpg" width="28" height="29" alt=""></a></td>
<td rowspan="2">
<img src="images/header_18.jpg" width="10" height="31" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="15" alt=""></td>
</tr>
<tr>
<td colspan="5">
<img src="images/header_19.jpg" width="589" height="16" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="16" alt=""></td>
</tr>
<tr>
<td>
<img src="images/spacer.gif" width="15" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="158" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="50" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="76" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="11" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="222" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="136" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="144" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="96" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="27" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="42" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="37" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="10" height="1" alt=""></td>
<td></td>
</tr>
</table>
<!-- End Save for Web Slices -->
</body>
</html>
Les pages content et footer sont à peu prés pareilles que le header et merci encore