Comment center son design

The s -  
 The s -
Bonjour a tous ^^

J'ai créer un design pour un site web ou plutôt dire un Kit Graphique j'ai passé par le découpage et tous...
mais le problème est comment le centrer je ne suis pas doué en CSS ou Xhtml...
S'il y a quelqu'un qui peut m'aider je suis vraiment bloqué

Voici ma page :

<html>
<head>
<title>psyren-psycher1</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!-- ImageReady Styles (psyren-psycher1.psd) -->
<style type="text/css">
<!--

#Table_01 {
position:absolute;
left:0px;
top:0px;
width:800px;
height:1000px;
}

#psyren-psycher123-01 {
position:absolute;
left:0px;
top:0px;
width:800px;
height:12px;
}

#psyren-psycher123-02 {
position:absolute;
left:0px;
top:12px;
width:16px;
height:988px;
}

#header {
position:absolute;
left:16px;
top:12px;
width:770px;
height:208px;
}

#psyren-psycher123-04 {
position:absolute;
left:786px;
top:12px;
width:14px;
height:988px;
}

#psyren-psycher123-05 {
position:absolute;
left:16px;
top:220px;
width:557px;
height:19px;
}

#index {
position:absolute;
left:573px;
top:220px;
width:57px;
height:19px;
}

#psyren-psycher123-07 {
position:absolute;
left:630px;
top:220px;
width:156px;
height:2px;
}

#psyren-psycher123-08 {
position:absolute;
left:630px;
top:222px;
width:3px;
height:778px;
}

#forum {
position:absolute;
left:633px;
top:222px;
width:63px;
height:17px;
}

#psyren-psycher123-10 {
position:absolute;
left:696px;
top:222px;
width:2px;
height:778px;
}

#Top-site {
position:absolute;
left:698px;
top:222px;
width:88px;
height:17px;
}

#psyren-psycher123-12 {
position:absolute;
left:16px;
top:239px;
width:167px;
height:71px;
}

#psyren-psycher123-13 {
position:absolute;
left:183px;
top:239px;
width:447px;
height:761px;
}

#psyren-psycher123-14 {
position:absolute;
left:633px;
top:239px;
width:63px;
height:761px;
}

#psyren-psycher123-15 {
position:absolute;
left:698px;
top:239px;
width:88px;
height:761px;
}

#psyren-psycher123-16 {
position:absolute;
left:16px;
top:310px;
width:167px;
height:690px;
}

-->
</style>
<!-- End ImageReady Styles -->
</head>
<body style="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<!-- ImageReady Slices (psyren-psycher1.psd) -->
<div id="Table_01">
<div id="psyren-psycher123-01">
<img src="images/psyren-psycher123_01.gif" width="800" height="12" alt="">
</div>
<div id="psyren-psycher123-02">
<img src="images/psyren-psycher123_02.gif" width="16" height="988" alt="">
</div>
<div id="header">
<img src="images/header.gif" width="770" height="208" alt="">
</div>
<div id="psyren-psycher123-04">
<img src="images/psyren-psycher123_04.gif" width="14" height="988" alt="">
</div>
<div id="psyren-psycher123-05">
<img src="images/psyren-psycher123_05.gif" width="557" height="19" alt="">
</div>
<div id="index">
<img src="images/index.gif" width="57" height="19" alt="">
</div>
<div id="psyren-psycher123-07">
<img src="images/psyren-psycher123_07.gif" width="156" height="2" alt="">
</div>
<div id="psyren-psycher123-08">
<img src="images/psyren-psycher123_08.gif" width="3" height="778" alt="">
</div>
<div id="forum">
<a href="https://psyren.forumth.com/login" target="_blank">
<img src="images/forum.gif" width="63" height="17" border="0" alt=""></a>
</div>
<div id="psyren-psycher123-10">
<img src="images/psyren-psycher123_10.gif" width="2" height="778" alt="">
</div>
<div id="Top-site">
<img src="images/Top-site.gif" width="88" height="17" alt="">
</div>
<div id="psyren-psycher123-12">
<img src="images/psyren-psycher123_12.gif" width="167" height="71" alt="">
</div>
<div id="psyren-psycher123-13">
<img src="images/psyren-psycher123_13.gif" width="447" height="761" alt="">
</div>
<div id="psyren-psycher123-14">
<img src="images/psyren-psycher123_14.gif" width="63" height="761" alt="">
</div>
<div id="psyren-psycher123-15">
<img src="images/psyren-psycher123_15.gif" width="88" height="761" alt="">
</div>
<div id="psyren-psycher123-16">
<img src="images/psyren-psycher123_16.gif" width="167" height="690" alt="">
</div>
</div>
<!-- End ImageReady Slices -->
</body>
</html>

Merci d'avance ^^
Configuration: Windows XP
Firefox 2.0.0.15

6 réponses

  1.
    LeYaude Messages postés 307 Statut Membre 46
     
    Pour centrer toute la page sur l'écran, tu peux essayer en CSS :

    body
    {
    margin : auto;
    }

    En fait ça permet de centrer n'importe quel élément (block) au milieu de la page.
    0
    1. The s
       
      Dans quelle ligne dois-je le placer ? (j'ai peine commencer dans ce domaine Y_Y)
      0
  2. LeYaude Messages postés 307 Statut Membre 46
     
    Par exemple au tout début du fichier CSS, c'est l'usage de placer les propriétés "générales" des "grosses" balises au début, mais d'un point de vue purement technique tu peux le placer là où tu veux.

    En fait tu le sais peut-être, mais la synthaxe du CSS fonctionne de la manière suivante :

    nom_de_la_balise
    {
    ici on met les propriétés de la balise
    }

    autre_balise
    {
    propriétés
    }

    etc...

    Et si tu veux aller un peu plus loin dans l'apprentissage (simple) du html et du css : https://openclassrooms.com/fr/courses

    Bon courage pour ton site !
    0
    1. The s
       
      Merci pour ta reponse ^^

      J'ai placer le code au debut du code CSS mais rien n'est passer :s
      peux-tu me corriger voici ce que j'ai fait :

      <html>
      <head>
      <title>psyren-psycher1</title>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      <!-- ImageReady Styles (psyren-psycher1.psd) -->
      <style type="text/css">
      <!--

      body
      {
      margin : auto;
      }

      #Table_01 {
      position:absolute;
      left:0px;
      top:0px;
      width:800px;
      height:1000px;
      }

      #essey-01 {
      position:absolute;
      left:0px;
      top:0px;
      width:800px;
      height:12px;
      }

      #essey-02 {
      position:absolute;
      left:0px;
      top:12px;
      width:16px;
      height:988px;
      }

      #header {
      position:absolute;
      left:16px;
      top:12px;
      width:770px;
      height:208px;
      }

      #essey-04 {
      position:absolute;
      left:786px;
      top:12px;
      width:14px;
      height:988px;
      }

      #essey-05 {
      position:absolute;
      left:16px;
      top:220px;
      width:557px;
      height:19px;
      }

      #index {
      position:absolute;
      left:573px;
      top:220px;
      width:57px;
      height:19px;
      }

      #essey-07 {
      position:absolute;
      left:630px;
      top:220px;
      width:156px;
      height:2px;
      }

      #essey-08 {
      position:absolute;
      left:630px;
      top:222px;
      width:3px;
      height:17px;
      }

      #forum {
      position:absolute;
      left:633px;
      top:222px;
      width:63px;
      height:17px;
      }

      #essey-10 {
      position:absolute;
      left:696px;
      top:222px;
      width:2px;
      height:17px;
      }

      #Top-site {
      position:absolute;
      left:698px;
      top:222px;
      width:88px;
      height:17px;
      }

      #essey-12 {
      position:absolute;
      left:16px;
      top:239px;
      width:167px;
      height:71px;
      }

      #essey-13 {
      position:absolute;
      left:183px;
      top:239px;
      width:30px;
      height:114px;
      }

      #Last-releases {
      position:absolute;
      left:213px;
      top:239px;
      width:560px;
      height:71px;
      }

      #essey-15 {
      position:absolute;
      left:773px;
      top:239px;
      width:13px;
      height:761px;
      }

      #essey-16 {
      position:absolute;
      left:16px;
      top:310px;
      width:167px;
      height:43px;
      }

      #essey-17 {
      position:absolute;
      left:213px;
      top:310px;
      width:560px;
      height:33px;
      }

      #essey-18 {
      position:absolute;
      left:213px;
      top:343px;
      width:413px;
      height:10px;
      }

      #Main-Navigation {
      position:absolute;
      left:626px;
      top:343px;
      width:147px;
      height:630px;
      }

      #essey-20 {
      position:absolute;
      left:16px;
      top:353px;
      width:16px;
      height:647px;
      }

      #actus---news {
      position:absolute;
      left:32px;
      top:353px;
      width:560px;
      height:589px;
      }

      #essey-22 {
      position:absolute;
      left:592px;
      top:353px;
      width:34px;
      height:647px;
      }

      #essey-23 {
      position:absolute;
      left:32px;
      top:942px;
      width:560px;
      height:58px;
      }

      #essey-24 {
      position:absolute;
      left:626px;
      top:973px;
      width:147px;
      height:27px;
      }

      -->
      </style>
      0
  3. LeYaude Messages postés 307 Statut Membre 46
     
    Bizarre, le CSS se comporte bizarrement des fois, d'ailleurs je suis en train de faire un design et je me suis bien arraché les cheveux hier ! lol.
    Essaie de retirer les caractères "<!--" au début, et "-->" à la fin de ton CSS, ce sont des commentaires HTML qui je pense n'ont rien à faire au milieu d'une feuille de style.
    0
    1. The s
       
      J'ai essayé ce que tu m'a dit mais sans succé Y_Y

      Ça fait presque deux jour que ce problème me torture
      0
  4. The s
     
    S'il vous plait aidez moi, je suis vraiment bloqué
    0

  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. The s
     
    Y'a quelqu'un ici qui peux m'aider u_u
    0

Discussions similaires

A quoi sert ETDctrl ? Peut-on le supprimer ?
Siempre2407 -
Siempre2407 -

2 réponses
A quoi sert ATI Catalyst Control Center ?
Ryder-SCS -
lepinojp -

16 réponses
ETD Control Helper dans System32 - Dois-je le supprimer ?
Miaou -
MisteryBean -

10 réponses
MSI Center ne veut pas se lancer
Ilyass_894 -
Lio-66 -

12 réponses
AMD catalyst control center
bibiche7200 -
bibiche7200 -

2 réponses