Discussion :

[ybruant]

Bonjour,

Dans un formulaire, j'ai un champ de saisie <textarea... et un champ de sélection <select multiple="multiple"... qui se suivent à un même niveau horizontal (ils sont en fait dans des cellules de table juxtaposées).

Pour leur affecter une hauteur et une présentation identique, dans ma feuille de style, j'ai ajouté :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
textarea {
padding:0;
margin:0;
border:1px solid #363;
}
select {
padding:0;
margin:0;
border:1px solid #363;
}
.textarea-select {
height: 80px; ...
}

naturellement, j'ai ajouté class="textarea-select" à mes deux déclarations de champs.

Le résultat obtenu avec Opera est :

Le résultat obtenu avec Firefox est :

Le résultat obtenu avec IE7 est :


Si les résultats avec Opera et Firefox correspondent à ce que j'attends (encore que le champ <textarea... soit un poil plus bas que celui de <select... avec Firefox), il n'en va pas de même du tout avec IE7 dont l'affichage ne me satisfait pas.

Y at-t-il moyen d'arranger la chose ?

Autre question, comment affecter la hauteur de ces champs pur qu'elle corresponde à un nombre entier de lignes, quelque soit le browser ? J'ai essayé une définition en em et ex sans que ça soit probant.

Merci.

[Bisûnûrs]

Essaie de jouer avec l'attribut size de la balise select, qui prend pour valeur un entier du nombre de lignes affichées.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<select size="6" ...>

[ybruant]

Merci,

mais l'attribut size ne permet pas d'harmoniser les hauteurs respectives de textarea et select...

[Bisûnûrs]

Mais ça permettra à IE7 qui n'en n'affiche que 5 d'afficher le 6e comme sur les autres navigateurs.

[ybruant]

Merci,

mais notez qu'Opera et Firefox en affichent respectivement 5 et 6, et qu'en tout état de cause, ça ne change pas le type de bordure affiché par IE7 pour le champ select.

[Bisûnûrs]

Ca, ça ne sera pas possbile de le modifier, c'est un style par défaut du navigateur, et les éléments de formulaire sont difficilement customisables.