overflow et tableau dynamique sous IE

Bonjour j'ai un gros probleme sous IE,

j'ai un tableau dynamique qui se remplit en fonction des parametres indiqués dans le formulaire du dessus. Le tout en submit et à chaque fois une requete a la base avec un implode.

J'ai un overflow sur le div en auto, le probleme est que de temps en temps je retrouve mon tableau plus bas quand je modifie les parametres.En fait il laisse la meme taille que le tableau sans scroll et il le met plus bas avec le scroll. J'ai remarqué que c'etait lorsqu'il y avait assez de ligne pour que le scroll soit activé.

quelqu'un a deja eu ce probleme?

C'est surement une question de padding ou de margin. Il faut les ajuster selon l'apparition du scroll ou pas.

ou un problème de float avec du width très précis qui serait modifié par l'apparition de la barre de scroll...

mais bon, ca reste du feeling

Non j'ai retiré tout ce qui etait width sauf sur celui de l'overflow sinon il ne se déclenche jamais.
Voici le code qu'il me reste. C'est vraiment super important

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
 
<style type="text/css">
<!--
div#content {
clear:both;
  width: 700px;
  height: 300px;
  overflow:auto;
  margin-top:0px;
}
-->
</style>
</head>
<body>
 
<!--TITRE-->
<form id="FormViewTicket" name="FormViewTicket" method="post"  action="">
<!--CONNECTION-->
<?php
        //Connection
        $link = mysql_connect("localhost", "root", "");
        mysql_select_db("incidents") or die(mysql_error());
?>
<!--CORPS-->
				 	<? 
                                        $result_division = mysql_query("SELECT NOM_DIVISION FROM `DIVISION` order by 1");
                                        // Gestion des erreurs
                                        if (!$result_division) {
                                        die('Requête invalide : ' . mysql_error());
                                }
                                while ($row_division = mysql_fetch_array($result_division, MYSQL_NUM)) {
                                                $division[] = $row_division[0] ;
                                }
                                        mysql_free_result($result_division);
            
                                        // Création du select categ
                                        echo '<select name="division" onchange="javascript:submit();">';
                                        echo '<option value=""'; if (!isset($_POST["division"])) echo "SELECTED >"; 
                                echo ' > </option>';
                                foreach ( $division as $key => $value )
                        {                                   
                                                echo '<option value="'.$value .'" '; if (isset($_POST["division"])){if ($_POST["division"]==$value) echo "SELECTED";}
                                        echo ' >' . $value . '</option>';       
                        }                               
                                echo '</select>' ;              
                                ?>
 
  <div id="content" class="style3">
      <table  align="center">
      <tr>
        <th style="background-color:#AFDBFE" >Ref</th>
        <th style="background-color:#AFDBFE" >Summary</th>
      </tr>
  <? 
          unset($parametres);
          //$parametres = array();
          if((isset($_POST['division']))and(!empty($_POST['division'])))
      {
        $parametres[] = 'DIVISION = "'.$_POST['division'].'"';
      }
          if (!empty($parametres)){
          $query ='SELECT ID_TICKET, SUJET from `ticket` where '.implode(' AND ', $parametres);;
          $result_Id = mysql_query("$query");
          // Gestion des erreurs
          if (!$result_Id) {
      die('Requête invalide : ' . mysql_error());
      }
          $i=0;   
          while ($row_Id = mysql_fetch_array($result_Id, MYSQL_ASSOC)) {
                        $nomTD = $row_Id["ID_TICKET"];
                        
                        if ($i==0){
                        echo '<tr style="background-color:#FFFFFF" onMouseOver="this.style.cursor=\'hand\';this.style.background=\'#FFECEC\';" onMouseOut="this.style.cursor=\'default\';this.style.background=\'#FFFFFF\';" >';
                        }
                        if ($i==1){
                        echo '<tr style="background-color:#E1EDFF" onMouseOver="this.style.cursor=\'hand\';this.style.background=\'#FFECEC\';" onMouseOut="this.style.cursor=\'default\';this.style.background=\'E1EDFF\';" >';
                        }
                        echo '<td  id="'.$nomTD.'" onclick="retourneValeur(\''.$nomTD.'\')">'.$row_Id["ID_TICKET"].'</td>' ;
                        echo '<td id="'.$nomTD.'" onclick="retourneValeur(\''.$nomTD.'\')">'.$row_Id["SUJET"].'</td>';
                         
                        echo '</tr>';
                         
                         if ($i==0) {$i=1;} else {$i=0;}
          }
          mysql_free_result($result_Id);
          }
?>     
    </table>
  </div>
  <!--Variable contenant le numéro de ticket-->
  <input type="hidden" value="" name="idtick" />
   </form>
 
<? mysql_close($link); ?>
</body>
</html>

comme ca je ne vois pas trop ce qui pourrait clocher.

il faudrait peut-être que tu nous montre le code une fois qu'il est passé a la moulinette de php (que du html et du css).

le top, ce serait un cas qui fonctionne comme tu veux et un cas qui pose le problème, histoire qu'on essaye de localiser ce qui peut faire la différence...

Tu veux le code généré par php?

je sais le récupéré à partir de firefox mais pas de IE et le probleme n'intervient que sous IE.

Comment je peux le récupérer à partir d'IE?

Le code est généré par le serveur, même si l'affichage est différent, le code sera le même.

Quoiqu'il en soit, tu peut quand même récupérer la source avec ie...
de mémoire: Affichage >> Source (et ca l'ouvre dans le bloc note il me semble)

2 pièce(s) jointe(s)

En pièce jointe je poste les codes sources avec IE, lun avec l'erreur et l'autre sans.Si vous jouez un peu avec le menu déroulant ou que vous passez d'une des 2 pages à l'autre vous verrez ca arrive de temps en temps.

Autre chose j'ai regardé le code généré avec FF et j'ai découvert une ligne du tableau qui peux être interressante lors de l'ajout d'un ligne dans le tableau: (none repeat scroll 0%;)

Code:

1
2
 
<tr style="background: rgb(255, 255, 255) none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; cursor: default;" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';">

ET voici le code du tableau:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
 
  <div id="content" class="style3">
      <table align="center">
      <tbody><tr>
        <th style="background-color: rgb(175, 219, 254);">Ref</th>
        <th style="background-color: rgb(175, 219, 254);">Summary</th>
      </tr>
  <tr style="background: rgb(255, 255, 255) none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; cursor: default;" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="157" onclick="retourneValeur('157')">157</td><td id="157" onclick="retourneValeur('157')">fdfsfds</td></tr><tr style="background: rgb(255, 236, 236) none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; cursor: default;" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="158" onclick="retourneValeur('158')">158</td><td id="158" onclick="retourneValeur('158')">gdfgfdgfd</td></tr><tr style="background: rgb(255, 255, 255) none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; cursor: default;" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="159" onclick="retourneValeur('159')">159</td><td id="159" onclick="retourneValeur('159')">jhjh</td></tr><tr style="background: rgb(255, 236, 236) none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; cursor: default;" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="160" onclick="retourneValeur('160')">160</td><td id="160" onclick="retourneValeur('160')">jjjj</td></tr><tr style="background: rgb(255, 255, 255) none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; cursor: default;" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="161" onclick="retourneValeur('161')">161</td><td id="161" onclick="retourneValeur('161')">jk</td></tr><tr style="background: rgb(255, 236, 236) none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; cursor: default;" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="162" onclick="retourneValeur('162')">162</td><td id="162" onclick="retourneValeur('162')">gfdgfd</td></tr><tr style="background: rgb(255, 255, 255) none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; cursor: default;" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="163" onclick="retourneValeur('163')">163</td><td id="163" onclick="retourneValeur('163')">rfdsgfd</td></tr><tr style="background: rgb(255, 236, 236) none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; cursor: default;" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="164" onclick="retourneValeur('164')">164</td><td id="164" onclick="retourneValeur('164')">fdsfds</td></tr><tr style="background: rgb(255, 255, 255) none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; cursor: default;" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="165" onclick="retourneValeur('165')">165</td><td id="165" onclick="retourneValeur('165')">jhgjhg</td></tr><tr style="background: rgb(255, 236, 236) none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; cursor: default;" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="167" onclick="retourneValeur('167')">167</td><td id="167" onclick="retourneValeur('167')">jhgj</td></tr><tr style="background: rgb(255, 255, 255) none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; cursor: default;" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="168" onclick="retourneValeur('168')">168</td><td id="168" onclick="retourneValeur('168')">Test priority 2</td></tr><tr style="background: rgb(255, 236, 236) none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; cursor: default;" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="169" onclick="retourneValeur('169')">169</td><td id="169" onclick="retourneValeur('169')">hgfhgf</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="170" onclick="retourneValeur('170')">170</td><td id="170" onclick="retourneValeur('170')">tttttt</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="171" onclick="retourneValeur('171')">171</td><td id="171" onclick="retourneValeur('171')">kjhk</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="172" onclick="retourneValeur('172')">172</td><td id="172" onclick="retourneValeur('172')">Test Priorite 2</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="173" onclick="retourneValeur('173')">173</td><td id="173" onclick="retourneValeur('173')">Test Priorite 2</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="174" onclick="retourneValeur('174')">174</td><td id="174" onclick="retourneValeur('174')">hgjgh</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="175" onclick="retourneValeur('175')">175</td><td id="175" onclick="retourneValeur('175')">hggfh</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="176" onclick="retourneValeur('176')">176</td><td id="176" onclick="retourneValeur('176')">,jh,h</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="177" onclick="retourneValeur('177')">177</td><td id="177" onclick="retourneValeur('177')">kjhk</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="178" onclick="retourneValeur('178')">178</td><td id="178" onclick="retourneValeur('178')">gfdg</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="180" onclick="retourneValeur('180')">180</td><td id="180" onclick="retourneValeur('180')">jghjhgjhg</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="181" onclick="retourneValeur('181')">181</td><td id="181" onclick="retourneValeur('181')">jhgjhgj</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="183" onclick="retourneValeur('183')">183</td><td id="183" onclick="retourneValeur('183')">hgfdhh</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="184" onclick="retourneValeur('184')">184</td><td id="184" onclick="retourneValeur('184')">fdsfds</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="185" onclick="retourneValeur('185')">185</td><td id="185" onclick="retourneValeur('185')">gfdgfdgd</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="186" onclick="retourneValeur('186')">186</td><td id="186" onclick="retourneValeur('186')">hfghgf</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="188" onclick="retourneValeur('188')">188</td><td id="188" onclick="retourneValeur('188')">hgfh</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="189" onclick="retourneValeur('189')">189</td><td id="189" onclick="retourneValeur('189')">hgfhfg</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="190" onclick="retourneValeur('190')">190</td><td id="190" onclick="retourneValeur('190')">hgfhgf</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="191" onclick="retourneValeur('191')">191</td><td id="191" onclick="retourneValeur('191')">jhg</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="192" onclick="retourneValeur('192')">192</td><td id="192" onclick="retourneValeur('192')">fdsfs</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="193" onclick="retourneValeur('193')">193</td><td id="193" onclick="retourneValeur('193')">jghjhg</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="194" onclick="retourneValeur('194')">194</td><td id="194" onclick="retourneValeur('194')">kjhkhkjh</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="195" onclick="retourneValeur('195')">195</td><td id="195" onclick="retourneValeur('195')">iuiu</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="196" onclick="retourneValeur('196')">196</td><td id="196" onclick="retourneValeur('196')">kjhkhkh</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="197" onclick="retourneValeur('197')">197</td><td id="197" onclick="retourneValeur('197')">hgfhfghfhfghfg</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="198" onclick="retourneValeur('198')">198</td><td id="198" onclick="retourneValeur('198')">gfdgfd</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="199" onclick="retourneValeur('199')">199</td><td id="199" onclick="retourneValeur('199')">hfghgfh</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="200" onclick="retourneValeur('200')">200</td><td id="200" onclick="retourneValeur('200')">gfdgfdgfd</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="201" onclick="retourneValeur('201')">201</td><td id="201" onclick="retourneValeur('201')">lkjlkjhlk</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="202" onclick="retourneValeur('202')">202</td><td id="202" onclick="retourneValeur('202')">ytuytuyt</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="203" onclick="retourneValeur('203')">203</td><td id="203" onclick="retourneValeur('203')">test</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="204" onclick="retourneValeur('204')">204</td><td id="204" onclick="retourneValeur('204')">gfdgfd</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="206" onclick="retourneValeur('206')">206</td><td id="206" onclick="retourneValeur('206')">gfdgfdg</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="207" onclick="retourneValeur('207')">207</td><td id="207" onclick="retourneValeur('207')">gfdgfd</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="208" onclick="retourneValeur('208')">208</td><td id="208" onclick="retourneValeur('208')">gfdgdf</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="209" onclick="retourneValeur('209')">209</td><td id="209" onclick="retourneValeur('209')">test</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="210" onclick="retourneValeur('210')">210</td><td id="210" onclick="retourneValeur('210')">dsqds</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="211" onclick="retourneValeur('211')">211</td><td id="211" onclick="retourneValeur('211')">fdsfdsfsd</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="212" onclick="retourneValeur('212')">212</td><td id="212" onclick="retourneValeur('212')">gggggg</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="213" onclick="retourneValeur('213')">213</td><td id="213" onclick="retourneValeur('213')">test</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="214" onclick="retourneValeur('214')">214</td><td id="214" onclick="retourneValeur('214')">hfhgfhgf</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="215" onclick="retourneValeur('215')">215</td><td id="215" onclick="retourneValeur('215')">hgfhgfhgfhf</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="216" onclick="retourneValeur('216')">216</td><td id="216" onclick="retourneValeur('216')">hgjfhgfhgjfhf</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="217" onclick="retourneValeur('217')">217</td><td id="217" onclick="retourneValeur('217')">hgfhgfhgfh</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="218" onclick="retourneValeur('218')">218</td><td id="218" onclick="retourneValeur('218')">gfggg</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="219" onclick="retourneValeur('219')">219</td><td id="219" onclick="retourneValeur('219')">ghfhgfh</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="220" onclick="retourneValeur('220')">220</td><td id="220" onclick="retourneValeur('220')">gdfgfd</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="221" onclick="retourneValeur('221')">221</td><td id="221" onclick="retourneValeur('221')">gfdgfdg</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="222" onclick="retourneValeur('222')">222</td><td id="222" onclick="retourneValeur('222')">bbgf</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="223" onclick="retourneValeur('223')">223</td><td id="223" onclick="retourneValeur('223')">fdsfdsfds</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="224" onclick="retourneValeur('224')">224</td><td id="224" onclick="retourneValeur('224')">ffffff</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="225" onclick="retourneValeur('225')">225</td><td id="225" onclick="retourneValeur('225')">hfghf</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="226" onclick="retourneValeur('226')">226</td><td id="226" onclick="retourneValeur('226')">hfghf</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="227" onclick="retourneValeur('227')">227</td><td id="227" onclick="retourneValeur('227')">hgj</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="228" onclick="retourneValeur('228')">228</td><td id="228" onclick="retourneValeur('228')">jjj</td></tr><tr style="background-color: rgb(225, 237, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='E1EDFF';"><td id="229" onclick="retourneValeur('229')">229</td><td id="229" onclick="retourneValeur('229')">gggg</td></tr><tr style="background-color: rgb(255, 255, 255);" onmouseover="this.style.cursor='hand';this.style.background='#FFECEC';" onmouseout="this.style.cursor='default';this.style.background='#FFFFFF';"><td id="231" onclick="retourneValeur('231')">231</td><td id="231" onclick="retourneValeur('231')">ffff</td></tr>     
    </tbody></table>
 
  </div>

j'ai ajouté la ligne

position: absolute;

et ca ne le fait plus depuis. Par contre c'est un peu embetant car je dois lui donner une position et donc la tableau se retrouve a des endroits different selon la resolution des pc.

comment je peux faire?

as-tu essayé position:relative?

avec absolute, tu positionnes ton élément par rapport aux premier élément dans l'ascendance qui est positionné.
avec relative, tu positionnes ton élément par rapport à l'endroit qu'il aurait occupé s'il n'avait pas été positionné.

Si le fait de le transformer en élement positionné règle le problème, alors position: relative devrait éviter les soucis de placement

bizarrement le position relative ne regle pas le probleme. si je mets un float:left ca règle le problème aussi.

Je peux reglé les distances avec un float aussi?