Bonjour,
Je suis en train de créer une page qui présente les caractéristiques d'une machine.
J'ai crée plusieurs divs qui me permettent de les positionner sur la page (avec top.)
Lorsque je click sur valider (submit) je reviens sur la page (normal car champs manquants) mais mes divs on bougé de position (ils ont bougé sur la gauche de peu).
Ce qui casse tout ma présentation a chaque submit.
Je n'ai pas d'exemples en ligne malheuresement.
Je vous donne mon css pour un cadre qui bouge et mon code html.
CSS:
c'est du chtml transitionnal, enfin j'essai au max de m'y adapter
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
SI qq1 peut me dire pourquoi mes cadres bougent (comme div info) lorsque on fait un submit.
Merci d'avance
Une image pour illustrer:
Avant:
Apres:
Je suis en train de créer une page qui présente les caractéristiques d'une machine.
J'ai crée plusieurs divs qui me permettent de les positionner sur la page (avec top.)
Lorsque je click sur valider (submit) je reviens sur la page (normal car champs manquants) mais mes divs on bougé de position (ils ont bougé sur la gauche de peu).
Ce qui casse tout ma présentation a chaque submit.
Je n'ai pas d'exemples en ligne malheuresement.
Je vous donne mon css pour un cadre qui bouge et mon code html.
CSS:
#info{
position:absolute;
left:3%;
top:20%;
border:1px solid #cccccc;
margin-top:1em;
padding-top:1em;
padding-bottom:1em;
padding-left:1em;
padding-right:1em;
text-align:left;
font-size:0.8em;
width:88.5%;
display:block;
}
#info h5{
position: absolute;
top:-7%;
background-color:white;
#global2{
position:absolute;
left: 50%;
top: 50%;
width: 550px;
height: 600px;
margin-top: -43%; /* moitié de la hauteur */
margin-left: -275px; /* moitié de la largeur */
border: 1px solid #000;
background-color:white;
text-align:center;/*sert a centre pour ie*/
display:inline;
}
HTML:
<div id="global2">
<div id="ficheid">
<h5>Fiche</h5>
<span class="sstitre"> <font color="<?php $error=$formajout->afferreur("num") ; echo $error;?>">N°: </font> </span><span style="position:relative; left:35%;"><input type="text" name="num" value="<?php echo $var;?>" size="3"></span><br>
<span class="sstitre"><font color="<?php $error=$formajout->afferreur("nommachine") ; echo $error; // on verifie si nommachine fait parti des errreur si oui on l affiche en rouge de meme pour chaque champ ci dessous?>">Nom machine:</font></span><span style="position:relative; left:1%;"><input type="text" name="nom_machine" value="<?php echo $_POST['nom_machine'];?>" size="6"></span><br>
<span class="sstitre"><font color="<?php $error=$formajout->afferreur("nomreseau") ; echo $error;?>">Nom réseau </font>:</span><span style="position:relative; left:4%;"><input type="text" name="nom_reseau" value="<?php echo $_POST['nom_reseau'];?>" size="6"></span>
</div><!--div fiche-->
<div id="interlocuteur">
<h5>Interlocuteur</h5>
<span class="sstitre"><font color="<?php $error=$formajout->afferreur("nom") ; echo $error;?>">Login:</font></span><span style="position:relative;"><select name="nom" size=1 onchange="">
<option value="-1" ><?php echo $choix_collaborateur;?></option>
<? $j=1;
while ($ligne_auteur=mysql_fetch_array($Auteur,MYSQL_NUM))// /tant qu'il existe es valeurs du tableau
{
if ($ligne_auteur[0] == $tous )// on test si elles ne prennent pas cette valuer sinon on affiche sa vraie valeur
{ $ligne_auteur[0] = false; //on attribu false si c tous
}
else
{
?>
<option value='<?php echo $ligne_auteur[0] ?>' ><?php echo $ligne_auteur[0];?></option>
<?php
}
$j= $j+1;//on incremente pour pouvoir parcourir le tableau
}?>
</select></span><br>
<span class="sstitre">Ne pas affecter</span><span><input type="checkbox" name="personne"></span>
</div><!--div interlocuteur--->
<div id="info">
<h5>Informations diverses</h5>
<span class="sstitre"><font color="<?php $error=$formajout->afferreur("ipdouai") ; echo $error;?>">IP Douai: </font></span><span ><input type="text" name="ipdouai" value="<?php echo $_POST['ipdouai']; ?>" size="12"></span>
<span style="position:relative; left:2%;">OS:</span><span style="position:relative; left:8.6%;"><select name="os" >
<?php while ($ligne_os=mysql_fetch_array($result_os,MYSQL_NUM)){//on affiche les os
echo '<option>'.$ligne_os[0].'</option>';}?>
</select></span>
<span class="sstitre" style="position:relative; left:15%;"><font color="<?php $error=$formajout->afferreur("constructeur") ; echo $error;?>">Constructeur: </font> </span><span style="position:relative; left:14.8%;"><select name="constructeur">
<?php while ($ligne_constructeur=mysql_fetch_array($result_constructeur,MYSQL_NUM)){///on affiche la lsite des constructeur
echo '<option>'.$ligne_constructeur[0].'</option>';}?></select></span><br>
<span class="sstitre"><font color="<?php $error=$formajout->afferreur("iplens") ; echo $error;?>">IP Lens: </font></span><span style="position:relative; left:1%;"><input type="text" name="iplens" value="<?php echo $_POST['iplens']; ?>" size="12"></span>
<span class="sstitre" style="position:relative; left:3.3%;"><font color="<?php $error=$formajout->afferreur("valeur") ; echo $error;?>">Valeur: </font></span><span style="position:relative; left:2.8%;"><input type="text" name="valeur" value="<?php echo $_POST['valeur']; ?>" size="4"></span>
<span class="sstitre" style="position:relative; left:12.4%;"><font color="<?php $error=$formajout->afferreur("processeur") ; echo $error;?>">Processeur: </font></span><span style="position:relative; left:13.5%;"><input type="text" name="processeur" value="<?php echo $_POST['processeur']; ?>" size="5"></span><br>
<span class="sstitre"><font color="<?php $error=$formajout->afferreur("iplille") ; echo $error;?>">IP Lille:</font></span><span style="position:relative; left:2.8%;"><input type="text" name="iplille" value="<?php echo $_POST['iplille'];?>" size="12"></span>
<span class="sstitre" style="position:relative; left:5%;"><font color="<?php $error=$formajout->afferreur("memoire") ; echo $error;?>">Mémoire:</font></span><span style="position:relative; left:3%;"><select name="memoire">
<option><?php echo $memoire4;?></option>
<option><?php echo $memoire1;?></option>
<option><?php echo $memoire2;?></option>
<option><?php echo $memoire3;?></option></select></span>
<span class="sstitre" style="position:relative; left:9%;"><font color="<?php $error=$formajout->afferreur("hdd") ; echo $error;?>">HDD:</font></span><span style="position:relative; left:18.3%;"><input type="text" name="hdd" value="<?php echo $_POST['hdd']; ?>" size="3"></span><br>
<span class="sstitre"><font color="<?php $error=$formajout->afferreur("wifi") ; echo $error;?>">Wifi: </font></span><span style="position:relative; left:5.2%;"><select name="wifi"><option><?php echo $opt1;?></option>
<option><?php echo $opt2;?></option></select></span>
<span class="sstitre" style="position:relative; left:17.4%;"><font color="<?php $error=$formajout->afferreur("mac") ; echo $error;?>">MAC: </font></span><span style="position:relative; left:18.3%;"><input type="text" name="mac" value="<?php echo $_POST['mac']; ?>" size="12"></span><br>
<span class="sstitre" style="position:relative; "><font color="<?php $error=$formajout->afferreur("numserie") ; echo $error;?>">Numsérie:</font></span><span style="position:relative; left:-0.5%;"><input type="text" name="numserie" value="<?php echo $_POST['numserie']; ?>" size="10"></span>
<span class="sstitre" style="position:relative; left:4.3%;"><font color="<?php $error=$formajout->afferreur("cdrom") ; echo $error;?>">Lecteur:</font></span><span style="position:relative; left:3.3%;"><select name="cdrom"><option ><?php echo $cdrom1?></option>
<option ><?php echo $cdrom2?></option>
<option ><?php echo $cdrom3?></option>
<option ><?php echo $cdrom4?></option></select></span>
</div><!--div info-->
<div id="desc">
<font color="<?php $error=$formajout->afferreur("desadmin") ; echo $error;?>"><h5>Descriptif</h5></font>
<textarea cols="58" rows="5" name="desadmin"><?php echo $_POST['desadmin'];?></textarea>
</div><!--div desc-->
<div id="button">
<center>
<input type="submit" name="chgt" value="Valider ">
<input type="button" name="print" value="Imprimer" onclick="print()">
<input type="button" name="fermer" value="Fermer " onclick="ferm()">
</center>
</div><!--div button-->
</div><!--div global2-->
</form>c'est du chtml transitionnal, enfin j'essai au max de m'y adapter
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
SI qq1 peut me dire pourquoi mes cadres bougent (comme div info) lorsque on fait un submit.
Merci d'avance
Une image pour illustrer:
Avant:
Apres: