[Résolu] [CSS et/ou xHTML] Problème d'alignement par Fazz - page 1

Bonjour !

J'ai un léger problème :
 
<img src="http://img372.imageshack.us/img372/8569/prob5hq.jpg" alt="Image utilisateur"/>
 
Comme vous le voyez, vers le bas, le texte se décale vers la gauche et c'est particulièrement agaçant. J'ai beau essayer de toutes les manières possibles, cela reste tel un bloc de pierre auquel on aurait manqué de respect.
 
Voici mon code, si ça peut vous aider (je pense que oui

)
 
Code : HTML<div class="code2 xml"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" > 
<head> 
<title>MSN Tips</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
<style type="text/css"> 
 
.bienvenue 
{ 
color: black; 
font-size: 30px; 
text-align:center; 
font-family:"Comic Sans MS", sans-serif; 
color: #c0c0ff; 
} 
 
a 
{ 
color:green; 
text-decoration: none; 
font-weight: bold; 
 
} 
 
.titreaccueil 
{ 
font-family:"Comic Sans MS", sans-serif; 
text-align : center; 
} 
 
.news 
{ 
color: black; 
font-size: 20px; 
text-align: center; 
font-family:"Comic Sans MS", sans-serif; 
text-decoration: blink; 
color: #006d84; 
} 
 
a:hover 
{ 
text-decoration: underline; 
} 
 
ul 
{ 
list-style-image: url("images/drunken_smilie.png";); 
} 
 
.articlesnews 
{ 
font-style: italic; 
text-align: center; 
overflow: auto; 
} 
 
body 
{ 
width: 790px; 
margin: auto; 
margin-top: 20px; 
margin-bottom: 20px; 
background-color: #ffffff; 
font-family:"Comic Sans MS", sans-serif; 
font-size: 14px; 
} 
 
#en_tete 
{ 
width:760px; 
height:100px; 
margin-bottom: 10px; 
background-image: url("images/ban.png";); 
background-repeat: no-repeat; 
} 
 
.element_menu 
{ 
background-repeat: repeat-x; 
margin-bottom: 20px; 
} 
 
#menu 
{ 
float: left; 
width: 140px; 
} 
 
.corps 
{ 
margin-left: 140px; 
margin-bottom: 20px; 
padding: 5px; 
 
} 
 
#pied_de_page 
{ 
text-align: center; 
font-size: 10px; 
} 
 
 
 
.sommaire 
{ 
font-size: 20px; 
font-family:"Comic Sans MS", sans-serif; 
color: #006d84; 
} 
 
 
 
.obl 
{ 
font-size: 10px; 
} 
 
h1,h2,h3,h4,h5,h6 
{ 
text-align: center; 
} 
 
#somm 
{ 
text-align: center; 
} 
 
.bizcenter 
{ 
text-align: center; 
} 
 
.gras 
{ 
font-weight: bold; 
} 
 
.souligne 
{ 
text-decoration: underline; 
} 
 
.barre 
{ 
text-decoration: line-through; 
} 
 
.italique 
{ 
font-style: italic; 
} 
 
.colvert 
{ 
color: green; 
} 
 
.fonffonf 
{ 
color: white; 
background-color: #006d84; 
} 
 
 
</style> 
 
</head> 
<body> 
<div id="en_tete"> 
 
</div> 
 
<div id="menu"> 
<div class="element_menu"> 
<h3>Le site</h3> 
 
<ul> 
<li><a href="index.html">Accueil</a></li> 
<li><a href="archives.html">Archives des news</a></li> 
<li><a href="reglement.html">Reglement</a></li> 
</ul> 
 
</div> 
 
<div class="element_menu"> 
<h3>MSN & Co</h3> 
 
<ul> 
<li><a href="astuces.html">Astuces</a></li> 
<li><a href="programmes.html">Programmes</a></li> 
<li><a href="skins.html">Skins</a></li> 
<li><a href="patchs.html">Patchs</a></li> 
<li><a href="tutoriaux.html">Tutoriaux du site</a></li> 
<li><a href="erreurs.html">Erreurs MSN</a></li> 
</ul> 
 
</div> 
 
<div class="element_menu"> 
<h3>Forum</h3> 
 
<ul> 
<li><a href=""></a></li> 
<li><a href=""></a></li> 
<li><a href=""></a></li> 
<li><a href=""></a></li> 
</ul> 
 
</div> 
 
</div> 
 
<div id="corps"> 
<h1 class="bienvenue">Bienvenue !</h1> 
<p class="texte">Bienvenue sur MSN Tips. Vous avez envie du meilleur de MSN, votre logiciel de communication favori ? Ne partez pas <img src="images/icon_biggrin.png" alt=":D" /> ! Ici, vous trouverez des telechargements, des patchs, des skins et des astuces qui vous permettront de personnaliser selon vos goûts MSN et d'impressionner vos amis <img src="images/icon_lol.gif" alt="hihi" />.</p> 
<p class="texte">Le but de ce site et d'améliorer MSN et de profiter au maximum de ce logiciel. MSN Tips est interactif et à l'écoute, donc si vous voulez participer au site, faites nous part de vos idées sur le forum.</p> 
<p class="texte">Faites nous aussi part des fautes d'orthographe repérées ... Cela nous aiderait beaucoup (car un site clair et avant tout un site sans fautes d'orthographe) !</p> 
<p class="texte">Si vous remarquez un élément qui vous appartient, un bug ou tout simplement, si vous voulez faire une remarque, <a href="mailto:">ecrivez-moi</a> !</p> 
<p class="texte">Les éléments à droits d'auteur seront bien sûr, précisés, mais il peut y avoir des oublis ou des elements dont la publication sur ce site vous gêne. Dans ces cas là, n'hésitez surtout pas à me le signaler !</p> 
<p class="texte">Enfin, bref... Trève de parlotte. Bon surf !</p> 
<h3 class="news">News du site</h3> 
<h5 class="bizcenter">Vendredi 23 decembre 2005 16:00</h5> 
<h5>Ouverture du site</h5> 
<br /> 
<p>Le site ouvre enfin ses portes ! Il reste de la construction, seul l'accueil et les astuces sont disponibles.</p> 
<p>Le club des 5 vous présente MSN Tips, un site aux telechargement 100% légaux (et oui, ça existe).</p> 
<p>Je suis en train d'apprendre le PHP ce qui permettra de nombreuses surprises sur le site, mais... chut !</p> 
<p>Voici donc les 5 admins qui vous accueillent des à présent dans un monde consacré à votre logiciel de communiction favori :</p> 
<br /> 
<p>Laetiti : Modératrice-Designer</p> 
<p>LittleFan : Modératrice</p> 
<p>Ced : Modérateur</p> 
<p>Doudy : Modératrice</p> 
<p>Et moi même, Livan qui fait un peu tout (en tant que créateur du site :p).</p> 
<br /> 
<p>Nous éspérons vous procurer de l'aide et de la connaissance en la matière.</p> 
<p><img src="images/arobz.png" alt="@" /> micalement, Livan</p> 
 
 
</div> 
 
<div id="pied_de_page"> 
<br /> 
<br /> 
<br /> 
<p> © "Livan" 2005, tous droits réservés</p> 
 
</div> 
 
 
 
<script language='javascript'>document.write('<img src="http://monsite.voila.fr/servlets/istat?site=msntips&page=/index.html&outil=ftpweb&n=' + Math.round(Math.random()*100000) + '" width=1 height=1>'); </script> 
<script language='javascript'>document.write('<img src="http://e.voila.fr/cgi-bin/ft/10000033638?&page=msntips_index.html&n=' + Math.round(Math.random()*100000) + '" width=1 height=1>');</script></body> 
</html> 
</div>
 
Ne faites pas attention au Javascript, c'est voilà qui en est la cause et c'est insupprimable (y z'ont pensé à tout

).
 

 
Respectueusement, un grand merci d'avance <img src="Templates/images/smilies/pleure.png" alt=":'(" class="smilies" /> .

Fazz

1 janvier 2006 à 14:47:11

jp949

1 janvier 2006 à 16:02:03

ta employé "id" avec selecteur "." change selecteur pour# ou mets <div class="corps>

Aurélien Massé

1 janvier 2006 à 17:06:32

Salut,
confond pas id et class les . et les #

EDIT: oups j'avais pas vu la reponse precedente dsl

1 janvier 2006 à 17:12:00

Tu ne vois pas qu' il est deja dans
<div id="corps"> ? le seul probleme c'est qu'il appelle sa regle avec "id" alors que son selecteur est "." ,ne vas pas embrouiller les choses

1 janvier 2006 à 17:43:42

Merci, mais j'ai beau remplacer mon .corps par un #corps, cela reste de même... :'(

1 janvier 2006 à 17:52:33

vas voir a cette adresse tu verras ta page
http://www.secpop-montpellier.fr/yalcin.html

Gamer_man

1 janvier 2006 à 18:11:55

Pourquoi un menu en float ?
Un display: absolute; aurait été plus judicieux, ensuite sur ton corps un simple <gras>padding-left: 200px;</gras (où bien sur 200 étant la taille du menu) et pas de problème.

Bisous

1 janvier 2006 à 18:14:59

Merci ! C'est gentil !
Seulement, une dernière chose. J'ai beau regarder, mais je me pose la question...
Qu'est-ce qui a changé ? o-O

1 janvier 2006 à 18:17:26

qu'est-ce qui a chagé ou? dans le code ou l'affichage?

1 janvier 2006 à 18:20:42

Dans le code...

2 janvier 2006 à 5:49:18

j'ai changé "." par "#"

2 janvier 2006 à 10:42:44

C'est tout ? OK.
En fait, moi après que vous me l'ayez dit, j'ai corrigé la page, mais sur mon hébérgeur il faut valider et j'avais oublié...
Bref, merci pour la correction !
Tu peux dés-héberger la page maintenant

.
Merci infiniment

--------------------------------------------------------------
RESOLU

[CSS et/ou xHTML] Problème d'alignement

[CSS et/ou xHTML] Problème d'alignement

Supprimer

Modérer

Signaler le message aux modérateurs