Régler la largeur d'une textbox

Régler la largeur d'une textbox - HTML/CSS - Programmation

Marsh Posté le 06-06-2007 à 09:25:11    

Est-ce qu'il y a un moyen de faire en sorte qu'une textbox (<input type="text"> ) occupe toute la largeur de l'élément dans lequel elle est placée ? En l'ocurence j'ai un truc comme ça :

<div class="field">
<input type="text" id="search" name="search" value="Search" size="16" onfocus="if (this.value=='Search') this.value=''" />
</div>


Le <div> a la bonne largeur, je le vois en affichant sa bordure. Par contre mon champs de texte n'occupe pas toute la place qui est disponible dans le <div>, et j'ai un espace libre à droite. Je pose la question pour un champs de texte.
 
En fait mon problème c'est que dans mon formulaire j'ai plusieurs champs de types différents (text, select...), et je voudrais que tous fassent la même largeur.


Message édité par matafan le 06-06-2007 à 09:25:32
Reply

Marsh Posté le 06-06-2007 à 09:25:11   

Reply

Marsh Posté le 07-06-2007 à 00:57:23    

tu mets dans ton css :

Code :
  1. #field input {
  2. width: XXpx;
  3. }


mais tu dois supprimer les "size" du code html :o


Message édité par dartyduck le 07-06-2007 à 00:58:01

---------------
Nikon D7000 + 18-105VR + 35mm 1.8
Reply

Marsh Posté le 07-06-2007 à 01:05:58    

matafan, tu as un niveau de html/css et de C assez différents il me semble :D
 

Citation :

) occupe toute la largeur de l'élément dans lequel elle est placée ?


 
comme l'as dis dartyduck, y a les css pour ça.
par contre moi j'aurai plutot mis width: 100%; à la vue de ta phrase


---------------
Blog photo/récits activités en montagne http://planetcaravan.net
Reply

Marsh Posté le 07-06-2007 à 09:32:52    

Effectivement ça marche. Je pensais pourtant avoir essayé, c'est fou. Finalement j'ai créé une class "fill" que j'utilise pour mes champs:

.fill {
  width: 100%;
}


Ca s'affiche nickel dans konqueror, par contre dans firefox mes champs text "débordent" légèrement de la boite dans laquelle ils se trouve (ils sont un chouïa trop larges et sont donc coupés à droite)... Alors que pour les <select> la largeur est bonne.

Reply

Marsh Posté le 07-06-2007 à 11:00:55    

utilise du padding dans "la boite" ou du margin sur tes champs


---------------
Blog photo/récits activités en montagne http://planetcaravan.net
Reply

Marsh Posté le 07-06-2007 à 11:24:39    

ou simplement tu descends à 90 ou 80%, tu dois avoir un margin ou un padding qqpart qui les poussent un peu :o


---------------
Nikon D7000 + 18-105VR + 35mm 1.8
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed