le pied de page passe sous le corps....

voilà, c'est la première fois que cela me le fait, j'ai un <div> qui passe sous un autre...

d'habitude, ils s'emboitent ou se poussent les uns les autres, mais là... o_O

voici le code de la page :

<!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>Neo, le passé futur</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="author" content="Corniot Laurent" />
<meta name="reply-to" content="finalbobcorp@hotmail.com" />
<link rel="stylesheet" media="screen" type="text/css" title="defaut" href="../defaut.css" />
</head>

<body>

<div class="en_tete"><p>Interface du jeu</p></div><div class="menu">
<div class="element_menu">
<h3>finalbob</h3>
<ul>
<li><a href="index.php?page=1" title="Pour voir vos caracteristiques... :D">Vos statistiques</a></li>
<li><a href="index.php?page=2" title="Quoi de neuf aujourd'hui dans la tribu... ?">Communauté</a></li>

<li><a href="index.php?page=3" title="Mon père, ma mère, mes frères et mes soeurs, et mes cousins et mes cousines, et mes oncles et mes tantes...">Votre famille</a></li>
<li><a href="index.php?page=5" title="haaaaouuuummmmmmm....">Religion</a></li>
<li><a href="index.php?page=6" title="grooooaaaaaaaar!!!!!">Au coin du feu</a></li>
<li><a href="index.php?page=8" title="Marche pas bien ! mais rien de bien grave, il suffit de deco/reco">Lahpaust (0)</a></li>
</ul>
</div>

<div class="element_menu">
<h3>Menu</h3>
<ul>
<li><a href="http://finalbob.free.fr/neo/forum/" title="LE forum officiel du jeu" onclick="window.open(this.href);return false;">forum</a></li>
<li><a href="index.php?page=50" title="Pour modifier vos infos persos">Votre compte</a></li>
<li><a href="deco.php" title="se deconnecter...">deconnexion</a></li>
</ul>

</div>
</div>


<div class="corps">
<div class="news">
<p><strong>La communauté possède

91970 points de nourriture et 656 points de bois.</strong><br />
Pour le moment, il y a <span title="au bois : Braice, Aymerik, Baggi, ">3 personnes au bois,</span> <span title="au baies : michelangelo, ">1 cueilleurs</span> et <span title="à la chasse : ktmt, laptitelili, finalbob, ">3 chasseurs</span>.<br /><span class="texte_vert" title="ce matin, un lapin...">vous partez à la chasse.</span> </p>

</div>
<div class="news">
<div class="stats_gauche">
<h3 class="titre_paragraphe">Caracteristiques de finalbob</h3>
<p>

<strong>Vous êtes : </strong>chef de famille                           
<strong>famille : </strong>aissdéhèf <br />
<strong>sexe : </strong>Femme <br />

<strong>age : </strong>74 <br /><br />
<strong>vie : </strong>1000 <br />
<strong>force : </strong>16 <br />
<strong>endurance : </strong>193 <br />
<strong>esprit : </strong>125 <br />
<strong>charisme : </strong>144<br />

<br />
<br />
<strong>chasse : </strong>258 <br />
<strong>cueillette : </strong>60 <br />
<strong>exploration : </strong>169 <br />
<strong>combat : </strong>10 <br />
<strong>artisanat : </strong>10 <br />

<strong>tutorat : </strong>10 <br />
<strong>spiritisme : </strong>55<br />
<br /><br /><br />
<a href="index.php?page=9" title="voir le classement">consulter le classement.</a>
</p>
</div>
<div class="stats_droite">
chasseur...
</div>

</div></div><div class="pied_de_page">
<p>made in 2006 by FiNalBoB team<sup>©</sup><br />
Page générée en 0.0137s.<br />Ce site est conforme au dernières normes <a href="http://validator.w3.org/check?uri=referer"> (x)HTML </a> et <a href="http://jigsaw.w3.org/css-validator/validator?uri=http://finalbob.free.fr/neo"> CSS </a>.
</p>
</div>
</body></html>

ainsi que mon CSS :

a
{
text-decoration:none;
color: #00548f;
}
a img
{
border: none;
text-decoration:none;
}
a:hover
{
color:white;
cursor: pointer;
background-color: #839983;
text-decoration:none;
}

body
{
font-family: Arial, Verdana, serif;
font-size: 11px;
margin-bottom: 20px;
background-color: #e8c47c;
padding: 10px;
}

caption /* Titre des tableaux */
{
margin: auto;
font-weight: bold;
font-size: 1.2em;
margin-top: 10px;
margin-bottom: 10px; /* Pour éviter que le titre ne soit trop collé au tableau en-dessous */
}

h3
{
font-size: 16px;
text-decoration: underline;
margin-top: 0px;
}

p
{
margin : 0px;
}

table
{
margin: auto;
margin-top: 20px;
margin-bottom: 20px;
border: 4px outset black; /* Bordure du tableau avec effet 3D (outset) */
border-collapse: collapse;
}

td, th
{
border: 1px solid black;
text-align: center; /* Tous les textes des cellules seront centrées */
padding: 10px; /* Petite marge interieure aux cellules pour éviter que le texte touche les bordures */
}
th
{
font-size: 1em;
}
ul
{
font-size: 12px;
}

.alpha
{
font-size: 9px;
color: green;
}

.centre
{
text-align: center;
}
.corps
{
margin: 10px;
margin-left: 190px;
padding: 0px;
}

.description_aide_bbcode
{
float: left;
width: 60%;
background: #f5cb60;
border: 2px solid black;
margin: 7px;
padding: 15px;
}
.droite
{
float: right;
}
.element_menu
{
background-color: #f5cb60;
margin: 0px;
margin-bottom: 20px;
border: 2px solid black;
padding: 10px;
}
.element_menu a
{
text-decoration:none;
color: black;
}

.en_tete
{
margin: 10px;
border-style: solid;
border-width: 3px;
border-color: #000000;
background: #ca9d3e;
}
.en_tete p
{
font-size: 2.5em;
text-align:center;
padding: 10px;
}

.gauche
{
float: left;
}

.menu
{
float: left;
width: 160px;
margin: 10px;
}

.news
{
background: #f5cb60;
border: 2px solid black;
margin: 0px;
margin-bottom: 10px;

padding: 20px;
}
.news_pseudo
{
margin : 5px;
font-size: 0.9em;
text-align:center;
}
.news_pseudo a
{
color: #54ae00;
}

.pied_de_page
{
text-align: center;
margin: 10px;
font-size: 10px;
}

.sans_indent
{
text-indent: 0px;
}

.stats_gauche
{
float: left;
width: 360px;
}
.stats_droite
{
margin-left: 400px;
}
.tableau_carac
{
left: 10%;
}

.tableau_smiley_aide
{
float: right;
width: 30%;
background: #f5cb60;
border: 2px solid black;
margin: 7px;
padding: 15px;
}

.texte_rouge
{
color: #FF0000;
}
.texte_vert
{
color: #008A00;
}

.titre_page
{
font-size: 24px;
}
.titre_paragraphe
{
font-weight: bold;
font-size: 12px;
text-indent: 20px;
}

après vérification auprès de ce cher vétrouassé (ouais, le w3c kouah...) Il s'avère que je n'ai aucune erreur de syntaxe...

Je précise que je suis sous mozilla...:s

Voici un screenchoot du rendu global... :

http://www.siteduzero.com/uploaded_img/3036/forum/-2/sans_titre.jpg

alors docteur ?
on ampute ?

finalbob

21 juin 2006 à 22:11:07

Riko

21 juin 2006 à 22:17:08

Salut, ajoutes un clear both a la class du pied de page

Anonyme

21 juin 2006 à 22:46:23

puisque ça doit se caller ^par rapport au menu et qu'il est en float alors normalement tu devrait mettre en float ton .pied_de_page
ça donne ça : .pied_de_page{float:left;}

21 juin 2006 à 22:50:02

Citation : Astrakhan

puisque ça doit se caller ^par rapport au menu et qu'il est en float alors normalement tu devrait mettre en float ton .pied_de_page

Pourquoi?

22 juin 2006 à 18:29:44

bon... grace à toi, riko, le pied de page retrouve sa bonne place....

mais par contre, mon corps reste toujours trop petit, et ce qu'il contient (toutes les statistiques de mon perso) en sortent par le bas...

Par contre, si je mets une grande image dans la partie droite, le corps reprends une hauteur normale, et l'harmonie visuelle est respectée....

donc, je ne sais pas trop quoi faire là...

AquaBoB

22 juin 2006 à 18:31:40

Essaye de mettre un margin: auto; sur ton corps

23 juin 2006 à 19:14:35

marche pas.....

je ne comprend pas.....

le pied de page passe sous le corps....

Supprimer

Modérer

Signaler le message aux modérateurs