Problème placement d'un div
Résolu
GTZ
-
Samaël666 Messages postés 84 Statut Membre -
Samaël666 Messages postés 84 Statut Membre -
Bonjour,
J'ai un soucis avec un div, il se place pas au bon endroit !
Je ne comprend pas pourquoi :/
http://kfet.guitouz-world.com/page.php
Le bloc "Statut" devrait être en dessous de celui des news voici les morceau de codes concernés :
#colone-gauche
{
float: left;
width: 228px;
color: white;
border: 1px solid;
background-color: #414141;
margin: 10px;
padding: 5px;
}
#colone-droite {
color: black;
float: right;
margin: 10px;
padding: 5px;
width: 630px;
display: inline;
position: relative;
border: 1px solid black;
background-color: #E8F2EA;
}
<div id="colone-gauche">
<fieldset>
<legend><img src="images/texte_infos.png" alt="Titre - News" ></legend>
<center>
<p>Ici les informations en cours ! Réunion, mise à jours, projets en cours ....</p>
<br><br></center></fieldset>
</div>
<div id="colone-gauche">
<fieldset>
<legend><img src="images/texte_statut.png" alt="Titre - Statut" ></legend>
<center>
<p>La K`fet est <font color="red">fermée</font></p>
<p>La K`fet est <font color="green" >ouverte</font> elle est gérée par <font color="grey">test</font></p>
<br><br></center>
</fieldset>
</div>
J'ai un soucis avec un div, il se place pas au bon endroit !
Je ne comprend pas pourquoi :/
http://kfet.guitouz-world.com/page.php
Le bloc "Statut" devrait être en dessous de celui des news voici les morceau de codes concernés :
#colone-gauche
{
float: left;
width: 228px;
color: white;
border: 1px solid;
background-color: #414141;
margin: 10px;
padding: 5px;
}
#colone-droite {
color: black;
float: right;
margin: 10px;
padding: 5px;
width: 630px;
display: inline;
position: relative;
border: 1px solid black;
background-color: #E8F2EA;
}
<div id="colone-gauche">
<fieldset>
<legend><img src="images/texte_infos.png" alt="Titre - News" ></legend>
<center>
<p>Ici les informations en cours ! Réunion, mise à jours, projets en cours ....</p>
<br><br></center></fieldset>
</div>
<div id="colone-gauche">
<fieldset>
<legend><img src="images/texte_statut.png" alt="Titre - Statut" ></legend>
<center>
<p>La K`fet est <font color="red">fermée</font></p>
<p>La K`fet est <font color="green" >ouverte</font> elle est gérée par <font color="grey">test</font></p>
<br><br></center>
</fieldset>
</div>
Configuration: Windows XP Firefox 3.5
3 réponses
-
Utilise dans ton css :
clear:left;
Comme attribut de ton div "status".
[Donc tu obtiens :#colone-gauche { clear:left; float: left; width: 228px; color: white; border: 1px solid; background-color: #414141; margin: 10px; padding: 5px; }
]
Je m'explique: clear prend trois valeurs : left, right et both.
Clear permet de ne pas laisser sur la même "ligne" deux éléments distincts.
Ici clear left va "renvoyer à la ligne" le div "statuts" puisqu'il y a quelque chose à gauche.
Cordialement, Samaël666. -
Insère ta div droite après
<div id="colone-gauche"> <fieldset> <legend><img src="images/texte_infos.png" alt="Titre - News" ></legend> <center> <p>Ici les informations en cours ! Réunion, mise à jours, projets en cours ....</p> <br><br></center></fieldset> </div>
Si je ne me trompe pas elle va être un cran plus haut ...
Et ça devrait pas poser problème niveau longueur !
Samaël666. -
Toi aussi et de rien ^^
Au fait, en bas tes crédits sont pas centrés ;)
[le "Copyright © - Lycée GrandMont - Maison Des Lycéens 2009-2010 - Tous droits réservés ® ,
Webmaster : ARNOUX Guillaume
- http://Kfet.MDL-Grandmont.fr -"]
Bonne soirée.
Cordialement, Samaël666.
