Problème de focus avec IE

Bonjour,

Je souhaite mettre un focus sur un input text, sur FF ça fonctionne très bien mais avec IE il met le focus sur mon bouton submit et non sur le champ texte !

la page : http://www.maxime-viry.com/asi/index.html

#search_area {
float: right;
right: 0;
padding-top: 3px;
padding-right: 10px;
color: #CC0000;
}
label {
vertical-align: middle;
}
input.area_recherche {
color: #CC0000;
background-color: #ffffff;
font-size: 1em;
width: 10em;
border: 1px solid #ffffff;
margin: 0;
vertical-align: middle;
padding-left: 2px;
}
input.area_recherche:focus {
border: 1px solid #0065b3;
}
input.submit_recherche {
color: #CC0000;
background-color: #FFCC00;
font-size: 1em;
border: double #ffffff;
margin-left: 2px;
vertical-align: middle;
cursor: pointer;
}
input.submit_recherche:hover {
color: #ffffff;
background-color: #ff7700;
}

Z'avez une idée ?
Modifié par Maxime VIRY (20 Mar 2008 - 11:48)

Bonjour,

Que veux-tu dire exactement?

1. le champ de type texte prend le focus (on peut y arriver et écrire dedans en naviguant au clavier) mais n'applique pas le style pour input.area_recherche:focus?
ou bien:
2. le champ de type texte ne prend pas le focus (on ne peut pas y arriver et écrire dedans en navigant au clavier)?

Le premier point est normal, c'est IE qui est bugué et n'implémente pas :focus.
Le deuxième point ne serait pas normal, par contre.

Mais je pense que tu voulais parler du premier?
Pour ce problème, si on veut quelque chose de compatible IE (6 et 7) il me semble qu'il faut passer par Javascript.

Pour les liens, on obtient le bon comportement en utilisant la pseudo-classe :active, par exemple ainsi:

a {color: blue;}
a:focus, a:active {color: red;}

Mais pour les autres éléments, dont les champs de formulaire, il me semble qu'utiliser :active ne fonctionnera pas ainsi.

Merci