Bonjour,

Voilà, je rencontre un léger problème avec IE. Pour faire court, j'ai 2 champs de même longueur qui s'affichent differement sous IE : l'un est plus court que l'autre.



Le même code sous Fx



Comme vous pouvez le voir, le problème ne se produit pas sous Firefox. Mais sans plus attendre, voici le code HTML du formulaire :

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
<form action='/user/login' method='post' name='login'>
  <table class='login'>
    <tr>
      <td>
        Pseudonyme : 
      </td>
      <td>
        <input type='text' size='20' name='nickname' />
      </td>
      <td rowspan='2' class='btn-login'>
        <table onclick='document.login.submit();' class='button'>
          <tr>
            <td class='lbtn'>
            </td>
            <td class='cbtn'>
              GO
            </td>
            <td class='rbtn'>
            </td>
          </tr>
        </table>
      </td>
    </tr>
    <tr>
      <td>
        Mot de passe : 
      </td>
      <td>
        <input type='password' size='20' name='password' />
      </td>
    </tr>
  </table>
</form>
Et le code CSS qui va avec
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
td.lbtn{
  width: 22px;
  background: url(pictures/btn-left.gif);
  height: 24px;
}
td.cbtn{
  background: url(pictures/btn-content.gif);
  color: white;
  font-weight: bold
}
td.rbtn{
  width: 22px;
  background: url(pictures/btn-right.gif)
}
table.login{
  float: right;
  border-collapse: collapse;
}
table.button{
  border-collapse: collapse
}
td.btn-login{
  vertical-align: middle
}
A priori, je ne vois pas ce qui peut causer ce problème Si quelqu'un a une idée, je suis preneur ^^

Merci