Probleme avec l'attribut font-family sous IE

Bonjour à tous


Voila mon code généré en PhP :

<select id="family" name="tabPolice" onChange="fct_selectDiv(this.id);">
<option value="arial" style=font-family:arial;>Arial</option>
<option value="comic sans ms" style=font-family:comic sans ms;>Comic</option>
<option value="courier new" style=font-family:courier new;>Courrier New</option>
<option value="tahoma" style=font-family:tahoma;>Tahoma</option>
<option value="times new roman" style=font-family:times new roman;>Times New Roman</option>
<option value="verdana" style=font-family:verdana;>Verdana</option>
<option value="baveuse" style=font-family:baveuse;>baveuse</option>
<option value="algerian" style=font-family:algerian;>Algerian</option>
</select

Voici le rendu avec Firefox :

http://i21.servimg.com/u/f21/11/11/08/44/ff10.jpg

Voici le rendu avec IE :

http://i21.servimg.com/u/f21/11/11/08/44/ie10.jpg

Quelqu'un aurait il une idée de la raison pour laquelle IE ne veut pas changer la police des balises <option>..petite précision aussi, le même type de procédé avec les couleurs marche sur les deux navigateurs.
Modifié par Bouba78 (10 Oct 2007 - 13:20)

Bonjour Koala,

Pour ce qui est des guillemets, j'ai testé avec et ça ne marche point même avec

Par contre je vais essayer de suite avec les classes
Modifié par Bouba78 (10 Oct 2007 - 13:54)

Désolé pour le double post..

Ca ne marche pas non plus avec les classes

Voici le code :

.arial{font-family:arial;} 
.comic sans ms{font-family:comic sans ms;} 
.courier new{font-family:courier new;} 
.tahoma{font-family:tahoma;} 
.times new roman{font-family:times new roman;} 
.verdana{font-family:verdana;} 
.baveuse{font-family:baveuse;} 
.algerian{font-family:algerian;}

http://smileys.sur-la-toile.com/repository/Messages/0001.gif
Modifié par Bouba78 (10 Oct 2007 - 14:30)

On pourrait effectivement corriger la syntaxe, et tant qu'à faire rajouter les majuscules qui vont bien (pas sûr que tous les navigateurs soient insensibles à la casse pour les noms de fontes). Ce qui donnerait:

.arial {font-family: Arial;} 
.comicsans {font-family: "Comic Sans MS";} 
.couriernew {font-family: "Courier New";} 
.tahoma {font-family: Tahoma;} 
.timesroman {font-family: "Times New Roman";} 
.verdana {font-family: Verdana;} 
.baveuse {font-family: Baveuse;}
.algerian {font-family: Algerian;}

On remarquera les guillemets lorsque c'est nécessaire, ainsi que la correction des noms des classes (pas d'espaces dans une classe, l'espace dans un sélecteur c'est le sélecteur de descendants!).

Mais même avec ça, il nous reste deux problèmes:

1. Il n'est pas sûr qu'il soit possible de styler ainsi individuellement les option. Les possibilités pour styler les éléments de formulaires sont réduites et peu cohérentes d'un navigateur à l'autre. Il se pourrait que ça ne soit jamais possible dans IE, Safari, Opera, Konqueror, etc.

2. Et si l'utilisateur n'a pas les fontes en question? Pour ma part, je n'ai pas Tahoma, Baveuse et Algerian. Et je n'ai les autres que parce que je les ai installées manuellement.
Même pour les utilisateurs de Windows, je ne suis pas sûr que "Baveuse" ou "Algerian" soient toujours disponibles.

Oui je pense que je vais bientôt me résoudre au fait que IE n'accepte pas les attributs font- pour les balises <option>
Modifié par Bouba78 (10 Oct 2007 - 15:46)