28172 sujets

CSS et mise en forme, CSS3

Bonjour,
je suis face à un problème et je vous demande de l'aide Smiley rolleyes

Sur une image, je voudrais mettre mon "corps". Comme vous pouvez voir ici : http://omegaclan.free.fr/test.html
Mais le corps se trouve sous le menu et le texte sort du cadre. (j'ai mis un fond et une bordure pour se repérer)
J'ai essayé plein de choses mais je suis perdu Smiley decu et je débute en CSS
D'ailleurs je ne sais pas si c'est la meilleure méthode, pouvez-vous m'aider ?

Merci.


	  body
{
   width: 860px;
   margin: auto; /* Pour centrer notre page */
   margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
   margin-bottom: 20px;    /* Idem pour le bas du navigateur */


#corps
{
width: 588px;
height: 545px;
   margin-top: 50px;
   margin-left: 300px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
   margin-bottom: 20px; /* pour éviter que le corps colle trop au pied de page en-dessous */
   padding: 20px 18px 8px 15px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   font : 0.7em Verdana, Helvetica, sans-serif;
   text-align : center;
   line-height : 22px;
   color: #492b11;
   background-color: #f2efee; /* Une couleur de fond pour le corps */
   /*background-image: url("menu/menutest.png");*/
   background-repeat: no-repeat;
   
   border: 2px solid black;  /* Une bordure pour bien marquer les limites du corps*/
}

#FondCorps
{
background-image: url("menu/menutest.png"); /* Change le nom pour mettre celui de ton image */
background-repeat: no-repeat;
width: 588px; /* Valeur d'exemple */
height: 555px; /* Valeur d'exemple */
margin: auto;
}
C'est normal que les marges ne collent pas puisque pour ton fond tu as mis margin-left:auto et que celle de ton texte est 300px ! ca a l'air de coller sur la gauche mais réduit la width de ton block de texte tout simplement. Smiley smile