Textarea - Passage à la ligne

Bonjour,

J'aimerais avoir un textarea qui ait les caractéristiques suivantes :
1. une largeur fixe
2. un passage à la ligne le plus strict possible : le texte DOIT passer à la ligne suivante s'il dépasse, même s'il faut couper un mot
3. optionellement (je peux faire autrement si besoin), une hauteur variable, suivant la longueur du texte

J'utilise donc le code suivant :

<textarea style="width: 100px; font-size: 16px; overflow: visible;"></textarea>
 

Sous IE, tous les points sont vérifiés. Sous Firefox, juste le premier

En image :
http://img217.imageshack.us/img217/7500/img13bs.gif
Avant de taper du texte. A gauche, IE met une hauteur minimale, pas FF (à droite).


http://img147.imageshack.us/img147/300/img25hg.gif
Après avoir tapé "0123456789" (sans espace ou saut de ligne), à gauche IE passe à la ligne et augmente la hauteur. A droite, FF me met une barre de défilement
Apparemment, FF ne coupe pas les mots pour les passages à la ligne.

J'aimerais donc savoir :
Est-il possible d'obtenir sous FF exactement le même résultat que sous IE, par une méthode quelconque ?

Merci d'avance
Modifié par JulienC (18 Apr 2006 - 16:37)

JulienC a écrit :
Apparemment, FF ne coupe pas les mots pour les passages à la ligne.

Tout à fait. Et comme tu ne peux pas changer le logiciel, tu ne peux rien y faire. Sauf peut-être faire un rapport de bug ou une demande de fonctionnalité aux développeurs, mais à mon avis ils ont déjà dû se poser la question.
Il semblerait que les développeurs de Firefox aient estimé que pour faire une zone de saisie sur une seule ligne, il y avait le input de type "text". J'avoue pour ma part qu'un textarea sur une seule ligne ne m'était jamais venu à l'esprit.

Pour la hauteur, tu veux dire que FF met une hauteur minimale (à vue de nez 2em ou 3em) au textarea, et que cette hauteur minimale est différente avec IE ?

J'ai jamais essayé, mais un min-height: 1em; pourrait peut-être marcher, qui sait.
EDIT: j'ai testé, et ça ne marche pas. On peut demander une hauteur minimale plus grande, mais pas plus petite. On peut par contre avoir une hauteur plus petite avec l'attribut height, mais dans ce cas le textarea ne peut pas s'étendre.

Sinon, tu peux aussi réduire un peu la hauteur de la manière suivante :

<textarea rows="1"></textarea>

(la valeur par défaut à l'air d'être deux lignes).
Modifié par mpop (18 Apr 2006 - 21:03)