Discussion :

[Invité]

Bonjour à tous,
Voilà, j'ai un souci sur un script personnel : l'image qui st correctement placé sous Opera et IE est décalé dans Chrome et Firefox
Voici le lien pour le voir (c'est l'afficheur de chroniques en haut de page qui tourne automatiquement) : http://le-pigeon.net
Donc en gros, faudrait que je reprécise pour Chrome et FF la place de l'image mais comment ?
Voici mon code de page d'accueil :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<div style="width:100%;height:100%;background-image:url('http://s3.noelshack.com/uploads/images/5604031170837_fond_3.png');background-repeat: repeat;background-position:top center;">
 <div style="margin:auto;width:100%; text-align:center">   
Mon code commence ici----><SCRIPT type="text/javascript">
var last="div1";
function enfin(a, link) {document.getElementById("linkframe").href=link; 
fade(document.getElementById(a), 1, 0, 2000);
setOpacity(document.getElementById(last), 0);last=a}
function rotate_src() {var j=parseInt(last.charAt(3), 10); j++; if (j==6){j=1}; 
if (j==1){enfin('div1',link[1])}; if (j==2){enfin('div2',link[2])}; if (j==3){enfin('div3',link[3])}; if (j==4){enfin('div4',link[4])}; if (j==5){enfin('div5',link[5])}}
function rotate() {setInterval("rotate_src()", 5000)}
document.onLoad = rotate();
</SCRIPT>
<Form>
<Input type=image src="http://i44.servimg.com/u/f44/14/84/69/24/plumeb11.png" width=90 height=50 name="b1" OnLoad="enfin('div1',link[1])" Onmouseover="enfin('div1',link[1])"></Input>
<Input type=image src="http://i44.servimg.com/u/f44/14/84/69/24/plumeb11.png" width=90 height=50 name="b2"  Onmouseover="enfin('div2',link[2])"></Input>
<Input type=image src="http://i44.servimg.com/u/f44/14/84/69/24/plumeb11.png" width=90 height=50 name="b3"  Onmouseover="enfin('div3',link[3])"></Input>
<Input type=image src="http://i44.servimg.com/u/f44/14/84/69/24/plumeb11.png" width=90 height=50 name="b4"  Onmouseover="enfin('div4',link[4])"></Input>
<Input type=image src="http://i44.servimg.com/u/f44/14/84/69/24/plumeb11.png" width=90 height=50 name="b5"  Onmouseover="enfin('div5',link[5])"></Input>
</FORM>
<Center><div id="frame" name="frame" style="width:500px; height:250px;background-color:black;"><a href="#" id="linkframe" style="display:block;width:100%;height:100%;">
<style type="text/css">
.rotator{position:absolute;opacity:0;filter:alpha(opacity=0);-moz-opacity:0;}
</style>
<SCRIPT type="text/javascript">
for (var i=1; i<6;i++){document.write("<IMG class='rotator' id='div"+i+"' SRC="+img[i]+" border=0 >");}
</SCRIPT>
</a></div></Center>
 <br>
Regardez ce topic pour savoir comment mettre votre chronique en page d'accueil:<a href="http://www.le-pigeon.net/t493-afficheur-en-page-d-accueil">ICI</a>
</div>   
   
   <p style="text-align:center;width:100%"><br /><br />Nos partenaires <br /></p>
   <div style="margin:auto;width:100%; text-align:center">
      <a href="http://lepigeon.forumpro.fr/forum?sid=315dc6ed521acb410de9e47f9a5b8607" class="postlink">
         <img src="http://s2.noelshack.com/uploads/images/9749286503847_mini_ban_1.png" border="0" alt="" />
      </a>

      <a href="http://www.retropixel.fr/forum/" class="postlink" target="_blank">
         <img src="http://www.retropixel.fr/forum/announcement/contest/contest_34/Cancre.gif" border="0" alt="" />
      </a>

      <a href="http://game-maker.forumpro.fr/">
      <img src="http://s3.noelshack.com/uploads/images/18274961531079_mini_banire_forum.png" />
      </a>
   </div>
</div>

[Willpower]

Réponse rapide sans avoir lu ton code.

As-tu essayé de mettre ceci dans ton CSS :

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

*{margin:0;padding:0}

?

[SpaceFrog]

réponse rapide en ayant survolé ton code:

Le mot qui me vient à l'esprit, c'est archéologe...

[Invité]

En rajoutant padding:0, c'est fixé sous chrome mais pas sous Firefox.
D4ailleurs, vu que c'est text-align:center qui me fait décaler mes images, faut il que je l'accompagne d'une autre propriété ?

[Willpower]

Je viens de cliquer sur ton lien sous IE, firefox, chrome et opéra et je ne décèle aucune différence..

[Invité]

Bon, a force de tatonnement, ça fonctionne avec un display:block dans ma class rotator...
Je n'ai plus de souci sur aucun navigateur.
Donc, RESOLU !
WillPower : j'ai fait la modif il y a une heure avant d'aller manger, donc c'est normal que tu dises ça maintenant =)