Discussion :

[nicorama]

Bonjour,
J'ai un div contenant un Label (rouge) et un TextField (jaune) ; le Label décrit le rôle du textfield.
J'aimerais que le textfield remplisse tout l'espace. Ce rendu sera surtout appréciable lorsqu'il y a plusieurs couples label/textfield dans le DIV englobant (voir pièce jointe).

La difficulté est que je ne connais pas à priori la largeur du Label. La largeur de l'input doit donc être 500 - label.width

Voici le code :

Code :

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

1
2
3
4
5
6
 
 
  <div id="container" style="width: 500px; height: 200px; border: black thin solid;">
            <div id="label" style="display: inline-block; background-color: red">Label - ---</div>
            <input id="textfield" type="text" style="background-color: yellow;">
  </div>

Je pensais mettre un width:100% au input, mais dans ce cas, il se met à la ligne et remplit le DIV, prenant ainsi 500px;

Merci !

[franculo_caoulene]

Salut,

Je vois deux solutions :
- tu définis tous les label comme ayant une certaine longueur, 20% par exemple. Puis les input comme ayant une longueur de 80%.
- tu utilises javascript après coup, ce sera de l'amélioration progressive.