Centrer une page web

Résolu
nichevi Messages postés 81 Date d'inscription   Statut Membre Dernière intervention   -  
 stylyroper -
Bonjour,
J'ai centrer mes pages web mais il y un problème à l'affichage.Le contenu n'ait pas centrer, c'est seulement la bannière et le pied de page qui sont centrer.
Merci pour votre aide.
A voir également:

4 réponses

Réponse 1 / 4
P@ Messages postés 1709 Date d'inscription   Statut Membre Dernière intervention   185
 
tu peux nous montrer le code stp ?
où une adresse où on pourrait consulter ??
ca aiderai
0
nichevi Messages postés 81 Date d'inscription   Statut Membre Dernière intervention   6
 
je vs envoie les codes


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Photos</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<META NAME="Generator" CONTENT="NetObjects Fusion 8 for Windows">
<SCRIPT>
<!--
function F_loadRollover(){} function F_roll(){}
//-->
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript1.2" SRC="file:///D:/Program Files/NetObjects/NetObjects Fusion 8/NetObjects System/rollover.js"></SCRIPT>
<LINK REL=STYLESHEET TYPE="text/css" HREF="file:///C:/site+/site2/sadet/Preview/style.css">
<LINK REL=STYLESHEET TYPE="text/css" HREF="file:///C:/site+/site2/sadet/Preview/site.css">
<STYLE></STYLE><NOLAYER>
<STYLE ID="NOF_STYLE_SHEET">
<!--
#Layer1 {
position:absolute;
left:7px;
top:160px;
width:504px;
height:37px;
z-index:1;
}
#Layer2 {
position:absolute;
left:1px;
top:157px;
width:473px;
height:64px;
z-index:1;
}
#Layer3 {
position:absolute;
left:572px;
top:372px;
width:163px;
height:180px;
z-index:2;
}
#Layer4 {
position:absolute;
left:425px;
top:249px;
width:105px;
height:126px;
z-index:2;
}
.Style1 {color: #51A72C}
a:link {
color: #316AC5;
}
a:visited {
color: #316AC5;
}
a:hover {
color: #990099;
}
#Layer5 {
position:absolute;
left:45px;
top:279px;
width:362px;
height:216px;
z-index:3;
}
.Style2 {font-size: 12px}
.Style3 {font-size: 12; }

-->
</STYLE>

</NOLAYER>
</HEAD>
<BODY NOF="(MB=(DefaultMasterBorder, 274, 66, 157, 10), L=(PhotosLayout, 624, 594))" TOPMARGIN=0 LEFTMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0>
<div id="Layer2">
<div align="center"><img src="pub2.jpg" width="728" height="90"></div>
</div>
<div id="Layer4">
<div align="center">
<table width="348" border="1">
<tr>
<th width="206" scope="col"><span class="Style1">BUREAUTIQUE</span></th>
<th width="108" scope="col"> </th>
</tr>
<tr>
<td scope="row"><a href="bureaux.html">Bureaux</a></a>,<a href="siege1.html">Sièges et Fauteuils</a>,<a href="canon.html">Photocopieurs</a>,Machines à écrire,<a href="mach calc.html">Machine à calculer</a>,<a href="scanners.html">Scanners</a>...  </td>
<td><img src="pub.1.gif" width="100" height="73"> </td>
</tr>
<tr>
<th scope="row"><span class="Style1">GALERIE ART-DECO </span></th>
<td> </td>
</tr>
<tr>
<td scope="row"><strong>DECORATION</strong>
</p>
</strong>
<p><a href="mob mais.html">Maisons</a>, <a href="mob bur.html">Bureaux</a>,<a href="bougie1.html">Bougies</a>,<a href="vase1.html"><a href="vase1.html">Vases</a> </td>
<td><img src="pub.2.gif" width="100" height="75"> </td>
</tr>
<tr>
<th scope="row"><span class="Style1">INFORMATIQUE</span></th>
<td> </td>
</tr>
<tr>
<td scope="row"><strong>ORDINATEUR DE MARQUE
</p>
</strong>
<p><a href="hp_dell.html">HP,Dell</a>,<a href="canon.html">Brother,Canon.</a>.. </td>
<td><img src="ordired.jpg" width="100" height="48"> </td>
</tr>
<tr>
<th scope="row"><span class="Style1">FABRICANT</span></th>
<td> </td>
</tr>
<tr>
<td scope="row"><a href="mob bur1.html">Mobilier de bureaux
</a>
<p><a href="mob mais1.html">Mobilier de maison</a></p>
<p><a href="mob hotel1.html">Mobilier pour hôtels  </a></p></td>
<td><img src="burRed.jpg" width="100" height="73"> </td>
</tr>
</table>
</div>
</div>
<div id="Layer5">
<div class="Style2" id="Layer10">
<p align="center" class="Style17 Style3"><strong>FABRICANT</strong></p>
<p align="center" class="Style2">La société BORRO FRERES dispose en son sein une grande usine de fabrication de mobilier (<a href="mob bur.html">Mobilier de bureau</a> et de maison) ; Borro est parmi les meilleurs et les plus grand <a href="mob mais.html">fabricant de mobilier</a>. Depuis plus de 40 ans Borro fabrique des <a href="bureaux.html">bureaux</a> de qualités avec du vrai bois de chez nous c'est-à-dire la Côte d’Ivoire.<br />
BORRO FRERES fabrique sur commande spéciales. </p>
<p align="center"> </p>
</div>
</div>
<div align="center">
<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0 NOF=LY>
<TR VALIGN=TOP ALIGN=LEFT>
<TD WIDTH=780>
<TABLE ID="Table78" BORDER=0 CELLSPACING=0 CELLPADDING=0 WIDTH="100%">
<TR HEIGHT=77>
<TD WIDTH=780 STYLE="background-color: rgb(255,255,255);">
<H1><IMG ID="Banner1" HEIGHT=120 WIDTH=780 SRC="bannière.jpg" VSPACE=0 HSPACE=0 ALIGN="TOP" BORDER=0 ALT="Your Title Here" TITLE="Your Title Here" NOF=B_H></TD>
</TR>
<TR HEIGHT=30>
<TD STYLE="background-image: url('file:///C:/site+/site2/sadet/Styles/Champion - Rust/images/navbar_bg.gif');">
<H1>
<TABLE WIDTH=781 BORDER=0 CELLSPACING=0 CELLPADDING=0 ALIGN=LEFT NOF=TE>
<TR>
<TD width="781">
<TABLE ID="NavigationBar1" BORDER=0 CELLSPACING=0 CELLPADDING=0 NOF=NB_FYHPNY120 WIDTH=780>
<TR VALIGN=TOP ALIGN=LEFT>
<TD WIDTH=130><A HREF="./index.html" style="cursor:hand; text-decoration:none;" onMouseOver="F_loadRollover('NavigationButton1','',0);F_roll('NavigationButton1',1)" onMouseOut="F_roll('NavigationButton1',0)"><IMG ID="NavigationButton1" NAME="NavigationButton1" HEIGHT=30 WIDTH=130 SRC="Autogen/Home_Nregular_1.gif" onLoad="F_loadRollover(this,'Home_NRregularRollover_1.gif',0)" BORDER=0 ALT="Home" TITLE="Home"></A></TD>
<TD WIDTH=130><A HREF="./contact_us.html" style="cursor:hand; text-decoration:none;" onMouseOver="F_loadRollover('NavigationButton2','',0);F_roll('NavigationButton2',1)" onMouseOut="F_roll('NavigationButton2',0)"><IMG ID="NavigationButton2" NAME="NavigationButton2" HEIGHT=30 WIDTH=130 SRC="Autogen/Contact_Us_Nregular_1.gif" onLoad="F_loadRollover(this,'Contact_Us_NRregularRollover_1.gif',0)" BORDER=0 ALT="Contact Us" TITLE="Contact Us"></A></TD>
<TD WIDTH=130><A HREF="./services.html" style="cursor:hand; text-decoration:none;" onMouseOver="F_loadRollover('NavigationButton3','',0);F_roll('NavigationButton3',1)" onMouseOut="F_roll('NavigationButton3',0)"><IMG ID="NavigationButton3" NAME="NavigationButton3" HEIGHT=30 WIDTH=130 SRC="Autogen/Services_Nregular_1.gif" onLoad="F_loadRollover(this,'Services_NRregularRollover_1.gif',0)" BORDER=0 ALT="Services" TITLE="Services"></A></TD>
<TD WIDTH=130><A HREF="./events.html" style="cursor:hand; text-decoration:none;" onMouseOver="F_loadRollover('NavigationButton4','',0);F_roll('NavigationButton4',1)" onMouseOut="F_roll('NavigationButton4',0)"><IMG ID="NavigationButton4" NAME="NavigationButton4" HEIGHT=30 WIDTH=130 SRC="Autogen/Events_Nregular_1.gif" onLoad="F_loadRollover(this,'Events_HRhighlightedRollover_1.gif',0)" BORDER=0 ALT="Events" TITLE="Events"></A></TD>
<TD WIDTH=260 HEIGHT=30><IMG ID="NavigationButton5" NAME="NavigationButton5" HEIGHT=30 WIDTH=130 SRC="Autogen/About_Nregular_1.gif" onLoad="F_loadRollover(this,'Photo_Gallery_HRhighlightedRollover_2.gif',0)" BORDER=0 ALT="Photo Gallery" TITLE="Photo Gallery"><img src="Autogen/Newsletter_Hhighlighted_1.gif" width="130" height="30"></TD>
</TR>
</TABLE> </TD>
</TR>
</TABLE> </TD>
</TR>
</TABLE> </TD>
</TR>
</TABLE>
<TABLE CELLPADDING=0 CELLSPACING=0 BORDER=0 WIDTH=781 NOF=LY>
<TR VALIGN=TOP ALIGN=LEFT>
<TD> </TD>
<TD>
<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0 NOF=LY>
<TR VALIGN=TOP ALIGN=LEFT>
<TD WIDTH=624>
<TABLE ID="Table3" BORDER=0 CELLSPACING=0 CELLPADDING=0 WIDTH="100%">
<TR HEIGHT=167>
<TD WIDTH=250>
<H1></TD>
<TD WIDTH=190>
<H1></TD>
<TD WIDTH=184>
<H1></TD>
</TR>
</TABLE> </TD>
</TR>
</TABLE> </TD>
</TR>
</TABLE>
<TABLE CELLPADDING=0 CELLSPACING=0 BORDER=0 WIDTH=710 NOF=LY>
<TR VALIGN=TOP ALIGN=LEFT>
<TD>
<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0 WIDTH=117 NOF=LY>
<TR VALIGN=TOP ALIGN=LEFT>
<TD WIDTH=37 HEIGHT=15><IMG SRC="file:///C:/site+/site2/sadet/Preview/Autogen/clearpixel.gif" WIDTH=37 HEIGHT=1 BORDER=0 ALT=""></TD>
<TD></TD>
</TR>
<TR VALIGN=TOP ALIGN=LEFT>
<TD HEIGHT=49></TD>
<TD WIDTH=80><A HREF="http://netobjects.com/"></A></TD>
</TR>
</TABLE> </TD>
<TD>
<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0 NOF=LY>
<TR VALIGN=TOP ALIGN=LEFT>
<TD WIDTH=33 HEIGHT=33><IMG SRC="file:///C:/site+/site2/sadet/Preview/Autogen/clearpixel.gif" WIDTH=33 HEIGHT=1 BORDER=0 ALT=""></TD>
<TD><p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p></TD>
</TR>
<TR VALIGN=TOP ALIGN=LEFT>
<TD></TD>
<TD WIDTH=560 NOF="NB_FYHTNN120" CLASS="TextNavBar" STYLE="text-align: center;">[<A HREF="./index.html">Home</A>] [<A HREF="./contact_us.html">Contact Us</A>] [<A HREF="./services.html">Services</A>] [<A HREF="./events.html">Events</A>] [<A HREF="Newsletter">Photo Gallery</A>]</TD>
</TR>
</TABLE> </TD>
</TR>
</TABLE>
</div>
</BODY>
</HTML>
0
Réponse 2 / 4
Gihef Messages postés 5150 Date d'inscription   Statut Contributeur Dernière intervention   2 779
 
Bonjour,

Je te propose une technique classique.
Place l'ensemble de la page dans un bloc que tu positionneras.

Alors, après
<STYLE ID="NOF_STYLE_SHEET"> 
<!--
ajoute
body {
  margin : 0;
  padding : 0;
  text-align : center;     /* c'est ça qui centre dans IE */
  }
#conteneur {
  position : relative;
  margin : 0 auto;          /* c'est ça qui centre dans les autres */
  padding : 0;
  text-align : left;
  border : 2px solid #f00;  /* ça c'est pour la voir. Tu peux le supprimer */
  width : 1008px; 
  }

Puis, juste après
<BODY NOF="(MB=(DefaultMasterBorder, 274, 66, 157, 10), L=(PhotosLayout, 624, 594))" TOPMARGIN=0 LEFTMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0>
ajoute
<div id="conteneur">

Puis, juste avant
</BODY>
ajoute
</div>

Ça ne fera que commencer à résoudre tes problèmes mais ça devrait centrer.


+ Merci de ne pas créer une succession de posts pour poser la même question.

Et attention à tes liens, certains pointent vers des dossiers de ton disque local
SRC="file:///C:/site+/site2/sadet/Preview/Autogen/clearpixel.gif"
en ligne, ça ne marchera pas.
0
Réponse 3 / 4
nera
 
c'est tres facil de center une page web !!! il vous suffit de mettre dans votre css :
<style>

#div-à-centrer {
position: relative;
margin: auto;
width: ce-que-vous-voulezpx;
}

</style>
0
Réponse 4 / 4
stylyroper
 
<!--
body {
background-image: url(img/intro.jpg);
background-repeat: no-repeat; background-position:top ; width:100%;
}
#apDiv1 {
position:absolute;
left:404px;
top:189px;
width:auto;
height:16px;
z-index:1;
}
#apDiv2 {
position:absolute;
left:558px;
top:187px;
width:39px;
height:21px;
z-index:2;
}
#apDiv3 {
position:absolute;
left:688px;
top:187px;
width:64px;
height:22px;
z-index:3;
}
#apDiv4 {
position:absolute;
left:833px;
top:188px;
width:84px;
height:19px;
z-index:4;
}
.Style6 {
color: #FFFFFF;
font-family: Georgia, "Times New Roman", Times, serif;
}
.Style7 {font-family: "Times New Roman", Times, serif; color: #FFFFFF;}
a:link {
color: #FFFFFF;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #FFFFFF;
}
a:hover {
text-decoration: underline;
color: #FFFFFF;
}
a:active {
text-decoration: none;
color: #FFFFFF;
}
-->
</style>
<div id="menu" align="right" >
<div class="Style6" id="apDiv1"><a href="ABOUT.php" target="_parent">ABOUT</a></div>
<div class="Style7" id="apDiv2"><a href="MALE.php" target="_parent">MALE</a></div>
<div class="Style7" id="apDiv3"><a href="F.php" target="_parent">FEMALE</a></div>
<div class="Style7" id="apDiv4"><a href="CONTACT.php" target="_parent">CONTACT</a></div>
0