Discussion :

[loukoum82]

Bonjour,
Le code suivant affiche sous FF un input et une image bien alignés sur la même ligne.
Mais sous IE, pour cb_2 l'image est décalée d'un pixel vers le bas par rapport à l'input.

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
 
<table width="100%" height="100%" style="font-family: Arial; font-size: 12px;">
       <tr>
        <td id="cb_1" colspan="2">
         <div style="width: 290px; display: inline; white-space: nowrap;">
          <input type="text" class="cbx" style="width: 275px; height: 16px;"/><img src="../images/cbxs/arrow.png" class="onmouseout"/>
        </div>
       </td>
       </tr>
 
       <tr>
        <td id="cb_2" colspan="2">
 
        <div style="width: 290px; display: inline; white-space: nowrap;">
         <input type="text" class="cbx" style="width: 275px; height: 16px;"/><img src="../images/cbxs/arrow.png" class="onmouseover"/>
         </div>
        </td>
       </tr>
       <tr>
        <td id="cb_3" colspan="2">
          <div style="width: 290px; display: inline; white-space: nowrap;">
            <input type="text" class="cbx_disabled" style="width: 275px; height: 16px;"/><img src="../images/cbxs/arrow_disabled.png" class="onmouseout"/>
        </div>
       </td>
      </tr>
    </table>

Résultat sous FF et pour cb_1 et cb_3 sous IE :


Résultat pour cb_2 sous IE :


Et les img.offsetTop sont identiques pour toutes les images...

C'est un peu aléatoire en fait sous IE, d'où mon incompréhension...

[vodiem]

salut loukoum82,

mets un style "vertical-align:middle;" sur tes balises: input et img.

[loukoum82]

Merci !