How to style textboxes only?

Hi,

I am making a site and it has several forms and I want all textboxes, dropdowns and textarea to be of 200px etc. on the forms. For that I put the code in my style sheet:


input,select,textarea { width: 200px; }

But this code also inceases the width of buttons, option buttons and checkboxes also by 200px.

How to force width to textboxes, select and textarea also and not others ???

Can I do something like ?

input.text { width:200px; } ???

Thanks.

Hi,

It depends on what browsers you are supporting as to what method you want to use.

If you want to support IE6 then you will need to add classes to the inputs to differentiate them as you mention above.


input.text {width:200px; }


<input [B]class="text"[/B] type="text" name="textfield" id="textfield" />

If you don’t need Ie6 support then you could use attribute selectors to target the various types of input without using classes.

e.g.


input[type="text"],
textarea,
select{width:200px;background:red}