Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Can I differentiate CSS on the different input types?

Tags:

css

input type=text/radio/checkbox - can I treat them differently in my CSS?

Other than by adding class= I mean

like image 731
Mawg says reinstate Monica Avatar asked Sep 23 '10 14:09

Mawg says reinstate Monica


People also ask

How do I target a specific input type in CSS?

If you only want to style a specific input type, you can use attribute selectors: input[type=text] - will only select text fields. input[type=password] - will only select password fields. input[type=number] - will only select number fields.

What is CSS input?

CSS attribute selectors select specific CSS input types for styling: input[type=text] - selects form fields that accept text. input[type=password] - selects form fields that accept passwords. input[type=number] - selects form fields that accept numbers. etc.


3 Answers

YES!

With an awesome thing called attribute selectors:

input[type="text"] { width: 200px; }

Just change that text there and you're good to go!

But note that these don't work on IE6, so you might want to take a look at the dean.edwards.name IE7.js :)

like image 143
Kyle Avatar answered Oct 04 '22 04:10

Kyle


You can use the attribute selector, like this

input[type=text] { ... }

However, this is not supported in all browsers. Your safest bet is to use a class

like image 40
Jimmy Avatar answered Oct 04 '22 03:10

Jimmy


You can use input[type=text] to do this. Old browsers might not support it though.

like image 27
greg0ire Avatar answered Oct 04 '22 04:10

greg0ire