La Communauté Webmaster  forum rss


  Forum-webmaster
  Technique - programmation
  HTML / CSS / XHTML
(Modérateurs: Shain, Netah, Lilian, lauryv, ToToMaStEr)
  CENTRER SON SITE WEB HORIZONTALEMENT
« Précédent Suivant »
Pages: [1] Descendre
Répondre    Aviser des réponses    Envoyer le sujet    Imprimer
  Auteur  Sujet: CENTRER SON SITE WEB HORIZONTALEMENT  (Lu 1221 fois)
CENTRER SON SITE WEB HORIZONTALEMENT
« sur: le 22-10-2006 a 19:35:28 »
AVL
Membre récent
*

Hors-Ligne

Messages: 4



Je suis un lama!

Voir le Profil
Répondre avec citation

Bonjour,
voilà mon probleme,je commence seulement dans la création de site web, et j'ai eu beau lire beaucoup de chose sur le centrage des sites web, je n'y arrive pas avec le mien. J'explique, je fais mon site avec publisher 2003 et je modifie le html avec notepad ( je sais ça va faire rire mais comme je vous l'ai dit je commence) pour vous donnez une idée voila l'adresse de mon site : http://perso.orange.fr/av.lignieres.foot/index.htm

Si je vous donne le code html d'une page d'acceuil toute simple que je viens de faire, pourriez vous me montrer comment faire avec un exemple concret pour que je puisse comprendre ?

<html xmlns:v="urn:schemas-microsoft-com:vml"
xmlns:o="urn:schemas-microsoft-com:office:office"
xmlns:dt="uuid:C2F41010-65B3-11d1-A29F-00AA00C14882"
xmlns="http://www.w3.org/TR/REC-html40">

<head>
<meta http-equiv=Content-Type content="text/html; charset=windows-1252">
<link rel=File-List href="accueil_fichiers/filelist.xml">
<!--[if !mso]>
<style>
v\:* {behavior:url(#default#VML);}
o\:* {behavior:url(#default#VML);}
b\:* {behavior:url(#default#VML);}
.shape {behavior:url(#default#VML);}
</style>
<![endif]-->
<title>Feuille blanche</title>
<style>
<!--
/* Définitions du style */
ol
   {margin-top:0in;
   margin-bottom:0in;
   margin-left:.25in;}
ul
   {margin-top:0in;
   margin-bottom:0in;
   margin-left:.25in;}
@page
   {size:8.2673in 11.6923in;}
-->
</style>
<!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="4098" fill="f" fillcolor="white [7]"
  strokecolor="black

  • ">
      <v:fill color="white [7]" color2="white [7]" on="f"/>
      <v:stroke color="black
  • " color2="white [7]">
      <o:left v:ext="view" color="black
  • " color2="white [7]"/>
      <o:top v:ext="view" color="black
  • " color2="white [7]"/>
      <o:right v:ext="view" color="black
  • " color2="white [7]"/>
      <o:bottom v:ext="view" color="black
  • " color2="white [7]"/>
      <o:column v:ext="view" color="black
  • " color2="white [7]"/>
      </v:stroke>
      <v:shadow color="#ccc [4]"/>
      <v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
      <o:colormru v:ext="edit" colors="yellow"/>
    </o:shapedefaults><o:shapelayout v:ext="edit">
      <o:idmap v:ext="edit" data="1"/>
      <o:regrouptable v:ext="edit">
      <o:entry new="1" old="0"/>
      </o:regrouptable>
    </o:shapelayout></xml><![endif]-->
    </head>

    <body link="#0066FF" vlink="#6633CC" bgcolor=yellow style='margin:0'>

    <div style='position:absolute;width:7.9319in;height:6.4736in'>
    <!--[if gte vml 1]><v:shapetype id="_x0000_t136" coordsize="21600,21600" o:spt="136"
    adj="10800" path="m@7,l@8,m@5,21600l@6,21600e">
    <v:formulas>
      <v:f eqn="sum #0 0 10800"/>
      <v:f eqn="prod #0 2 1"/>
      <v:f eqn="sum 21600 0 @1"/>
      <v:f eqn="sum 0 0 @2"/>
      <v:f eqn="sum 21600 0 @3"/>
      <v:f eqn="if @0 @3 0"/>
      <v:f eqn="if @0 21600 @1"/>
      <v:f eqn="if @0 0 @2"/>
      <v:f eqn="if @0 @4 21600"/>
      <v:f eqn="mid @5 @6"/>
      <v:f eqn="mid @8 @5"/>
      <v:f eqn="mid @7 @8"/>
      <v:f eqn="mid @6 @7"/>
      <v:f eqn="sum @6 0 @5"/>
    </v:formulas>
    <v:path textpathok="t" o:connecttype="custom" o:connectlocs="@9,0;@10,10800;@11,21600;@12,10800"
      o:connectangles="270,180,90,0"/>
    <v:textpath on="t" fitshape="t"/>
    <v:handles>
      <v:h position="#0,bottomRight" xrange="6629,14971"/>
    </v:handles>
    <o:lock v:ext="edit" text="t" shapetype="t"/>
    </v:shapetype><v:shape id="_x0000_s1035" type="#_x0000_t136"
    href="http://perso.orange.fr/av.lignieres.foot/index.htm" style='position:absolute;
    left:222.1pt;top:423pt;width:139.5pt;height:41.25pt;z-index:3;
    mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
    mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' o:regroupid="1"
    fillcolor="yellow" strokecolor="black
  • " o:cliptowrap="t">
    <v:stroke>
      <o:left v:ext="view" color="black
  • " color2="white [7]"/>
      <o:top v:ext="view" color="black
  • " color2="white [7]"/>
      <o:right v:ext="view" color="black
  • " color2="white [7]"/>
      <o:bottom v:ext="view" color="black
  • " color2="white [7]"/>
      <o:column v:ext="view" color="black
  • " color2="white [7]"/>
    </v:stroke>
    <v:shadow on="t" type="perspective" color="#c7dfd3" opacity="52429f" origin="-.5,-.5"
      offset="-26pt,-36pt" matrix="1.25,,,1.25"/>
    <v:path insetpenok="f"/>
    <v:textpath style='font-family:"Times New Roman";v-text-kern:t' trim="t"
      fitpath="t" string="ENTRER"/>
    </v:shape><![endif]--><![if !vml]><span style='position:absolute;z-index:3;
    left:261px;top:516px;width:233px;height:104px'><map name=MicrosoftOfficeMap0><area
    shape=Polygon
    coords="0, 0, 0, 2, 4, 16, 4, 48, 0, 66, 0, 68, 37, 80, 32, 102, 33, 102, 222, 102, 223, 102, 217, 96, 210, 80, 233, 67, 233, 65, 230, 64, 221, 48, 221, 32, 225, 20, 226, 13, 219, 2, 215, 0, 0, 0"
    href="http://perso.orange.fr/av.lignieres.foot/index.htm"></map><img border=0
    width=233 height=104 src="accueil_fichiers/image317.gif"
    usemap="#MicrosoftOfficeMap0" alt=ENTRER v:shapes="_x0000_s1035"></span><![endif]><!--[if gte vml 1]><v:rect
    id="_x0000_s1036" href="http://perso.orange.fr/av.lignieres.foot/index.htm"
    style='position:absolute;left:195pt;top:135pt;width:193.71pt;height:282pt;
    z-index:4;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
    mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt'
    o:preferrelative="t" o:regroupid="1" filled="f" fillcolor="white [7]"
    stroked="f" strokecolor="black
  • " o:cliptowrap="t">
    <v:fill color2="white [7]"/>
    <v:stroke color2="white [7]">
      <o:left v:ext="view" color="black
  • " color2="white [7]"/>
      <o:top v:ext="view" color="black
  • " color2="white [7]"/>
      <o:right v:ext="view" color="black
  • " color2="white [7]"/>
      <o:bottom v:ext="view" color="black
  • " color2="white [7]"/>
      <o:column v:ext="view" color="black
  • " color2="white [7]"/>
    </v:stroke>
    <v:imagedata src="accueil_fichiers/image312.gif" o:title="Fanion-de-l'-Av-FOOTBALL"/>
    <v:shadow color="#ccc [4]"/>
    <v:path o:extrusionok="f" insetpenok="f"/>
    <o:lock v:ext="edit" aspectratio="t"/>
    </v:rect><![endif]--><![if !vml]><span style='position:absolute;z-index:4;
    left:260px;top:180px;width:258px;height:376px'><a
    href="http://perso.orange.fr/av.lignieres.foot/index.htm"><img border=0
    width=258 height=376 src="accueil_fichiers/image3121.gif" v:shapes="_x0000_s1036"></a></span><![endif]><!--[if gte vml 1]><v:shape
    id="_x0000_s1037" type="#_x0000_t136" style='position:absolute;left:172.6pt;
    top:81pt;width:238.5pt;height:51pt;z-index:5;mso-wrap-distance-left:2.88pt;
    mso-wrap-distance-top:2.88pt;mso-wrap-distance-right:2.88pt;
    mso-wrap-distance-bottom:2.88pt' o:regroupid="1" fillcolor="yellow"
    strokecolor="#33c" strokeweight=".35269mm" o:cliptowrap="t">
    <v:stroke>
      <o:left v:ext="view" color="black
  • " color2="white [7]"/>
      <o:top v:ext="view" color="black
  • " color2="white [7]"/>
      <o:right v:ext="view" color="black
  • " color2="white [7]"/>
      <o:bottom v:ext="view" color="black
  • " color2="white [7]"/>
      <o:column v:ext="view" color="black
  • " color2="white [7]"/>
    </v:stroke>
    <v:shadow on="t" color="#99f" offset="3pt"/>
    <v:path insetpenok="f"/>
    <v:textpath style='font-family:"Arial Black";v-text-kern:t' trim="t"
      fitpath="t" string="BIENVENUE"/>
    </v:shape><![endif]--><![if !vml]><span style='position:absolute;z-index:5;
    left:229px;top:107px;width:324px;height:72px'><img width=324 height=72
    src="accueil_fichiers/image315.gif" alt=BIENVENUE v:shapes="_x0000_s1037"></span><![endif]>
    </div>

    </body>

    </html>

    Je vous en remercie d'avance
    AVL

  • Rapporter au modérateur  

    Re:CENTRER SON SITE WEB HORIZONTALEMENT
    « Répondre #1 sur: le 23-10-2006 a 11:38:11 »
    OKKO
    Superactif
    ****

    Hors-Ligne

    Sexe: Male
    Messages: 645



    Gueulard Deluxe - Disponible à 25% -

    Voir le Profil    WWW
    Répondre avec citation

    j'ai mal à la tête avec tout ce code !


    Regarde ici :
    http://css.alsacreations.com/

    Rapporter au modérateur  

    " Le raffinement est chose froide "
    Re:CENTRER SON SITE WEB HORIZONTALEMENT
    « Répondre #2 sur: le 23-10-2006 a 11:47:54 »
    Zed2006
    Membre récent
    *

    Hors-Ligne

    Messages: 2



    Je suis un lama!

    Voir le Profil    E-Mail
    Répondre avec citation

    Hello,
    Moi aussi je débute dans la création de site, un petit conseil "offres" toi Dreamweaver...t'as des modèles de base tout à fait potables.

    Rapporter au modérateur  
    Re:CENTRER SON SITE WEB HORIZONTALEMENT
    « Répondre #3 sur: le 23-10-2006 a 11:58:02 »
    AVL
    Membre récent
    *

    Hors-Ligne

    Messages: 4



    Je suis un lama!

    Voir le Profil
    Répondre avec citation

    Je viens d'avoir dreamweaver et j'essaye actuellement de comprendre comment il fonctionne.
    je vais persister.
    J'attend quand meme toujours une réponse
    AVL

    Rapporter au modérateur  
    Re:CENTRER SON SITE WEB HORIZONTALEMENT
    « Répondre #4 sur: le 23-10-2006 a 14:02:19 »
    OKKO
    Superactif
    ****

    Hors-Ligne

    Sexe: Male
    Messages: 645



    Gueulard Deluxe - Disponible à 25% -

    Voir le Profil    WWW
    Répondre avec citation

    Un début de réponse ( il faudra que tu cherches de ton coté):

    Pour centrer ton site il faut qu'il tienne dans un "Conteneur".
    C'est à dire un calque (DIV) qui sera formaté par ta feuille de style, a qui on donnera un "id" et qui recevra les info suivantes :
     
    exemple pour un écran  de 700X400:

    déla le style css :
    #Monconteneur {
        position:absolute;
        left: 50%;
        top: 50%;
        width: 700px;
        height: 400px;
        margin-top: -200px; /* moitié de la hauteur */
        margin-left: -350px; /* moitié de la largeur */
        border: 1px solid #000;
    }

    dans le body
    <div id="Monconteneur">

    <!-- et là tes éléments --->
    </div>

    et la source ce trouve là, il faut aussi savoir chercher un peu:
    http://css.alsacreations.com/Faire-une-mise-en-page-sans-tableaux/Centrer-les-elements-ou-un-site-web-en-CSS

    Tchao !

    « Dernière Édition: le 23-10-2006 a 15:53:47 par OKKO » Rapporter au modérateur  

    " Le raffinement est chose froide "
    Re:CENTRER SON SITE WEB HORIZONTALEMENT
    « Répondre #5 sur: le 23-10-2006 a 15:14:17 »
    AVL
    Membre récent
    *

    Hors-Ligne

    Messages: 4



    Je suis un lama!

    Voir le Profil
    Répondre avec citation

    Je vous remercie, les liens que tu m'a donné OKKO je les avais bien lu, mais pas comprise. Alors que la je comprends déja mieux et je vais essayé.
    Merci bien

    Rapporter au modérateur  
    Re:CENTRER SON SITE WEB HORIZONTALEMENT
    « Répondre #6 sur: le 23-10-2006 a 15:47:30 »
    OKKO
    Superactif
    ****

    Hors-Ligne

    Sexe: Male
    Messages: 645



    Gueulard Deluxe - Disponible à 25% -

    Voir le Profil    WWW
    Répondre avec citation

    Oui excuse, je comprends que l'on soit perdu

    Bon courage 

    Rapporter au modérateur  

    " Le raffinement est chose froide "
    Re:CENTRER SON SITE WEB HORIZONTALEMENT
    « Répondre #7 sur: le 23-10-2006 a 15:48:24 »
    AVL
    Membre récent
    *

    Hors-Ligne

    Messages: 4



    Je suis un lama!

    Voir le Profil
    Répondre avec citation

    Je suis ravi  merci bien OKKO ta façon simple de m'expliquer a fait que j'ai réussi.
    Bye 

    Rapporter au modérateur  
    Re:CENTRER SON SITE WEB HORIZONTALEMENT
    « Répondre #8 sur: le 23-10-2006 a 15:54:23 »
    OKKO
    Superactif
    ****

    Hors-Ligne

    Sexe: Male
    Messages: 645



    Gueulard Deluxe - Disponible à 25% -

    Voir le Profil    WWW
    Répondre avec citation

    Parfait !


    Merci pour le retour 

    @+ ici

    Rapporter au modérateur  

    " Le raffinement est chose froide "
    Répondre    Aviser des réponses    Envoyer le sujet    Imprimer
    Pages: [1] Monter
    « Précédent Suivant »
    Sauter à: 

    Votre statut : Invité
    Vous devez être membre pour participer.
     
     
    Let’s Encrypt : le certificat SSL gratuit
    Tester votre site internet sur différents navigateurs
    [WordPress] Des problèmes avec l’administration ?
    Rappel : Mettez à jour vos CMS et vos sites E-commerce
    Le .fr fête ses 25 années d’existence !
    Mesurer votre audience en temps réel avec BubbleStat
    Porter réclamation contre Google Panda ?
    Zlio n’est plus …
     
     
     
     
     

    Copyright (c) Devclic 2002 - 2026 - Tous droits réservés

    creation site internet strasbourg