css input fields

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
s.dot
Tranquility In Moderation
Posts: 5001
Joined: Sun Feb 06, 2005 7:18 pm
Location: Indiana

css input fields

Post by s.dot »

Hello,

I am nearly finished with a client site. He wishes for all input fields that are of type "text" to have a border and a background color.

If I simply make a input { border: ...; background-color: #...; } in the style sheet, it will apply this to submit buttons as well.. which I do not want.

Can I apply css only to the text fields from the style sheet, or would I have to make a class in the stylesheet and manually add class="..." to each individual input text field?

-Scott
Set Search Time - A google chrome extension. When you search only results from the past year (or set time period) are displayed. Helps tremendously when using new technologies to avoid outdated results.
thiscatis
Forum Contributor
Posts: 434
Joined: Thu Jul 20, 2006 11:00 am

Post by thiscatis »

There is solution to define your input only for text in your css, but it doesn't work in IE.
Best way to do it, is to add a class
matthijs
DevNet Master
Posts: 3360
Joined: Thu Oct 06, 2005 3:57 pm

Post by matthijs »

Code: Select all

input[type="text"] { width: 200px;border:1px solid #ddd; }
Doesn't work in IE6 unfortunately. But we all know what to do with that browser...

Otherwise, as thiscatis mentioned, use a class
User avatar
JayBird
Admin
Posts: 4524
Joined: Wed Aug 13, 2003 7:02 am
Location: York, UK
Contact:

Post by JayBird »

Also, background colors on form elements don't work on Mac's FYI
Last edited by JayBird on Wed May 23, 2007 3:31 am, edited 1 time in total.
User avatar
s.dot
Tranquility In Moderation
Posts: 5001
Joined: Sun Feb 06, 2005 7:18 pm
Location: Indiana

Post by s.dot »

Don't want to get into the whole IE flaming.. but dammit! It would've been so much easier. Manually adding classes to each input field is going to be a doozy.
Set Search Time - A google chrome extension. When you search only results from the past year (or set time period) are displayed. Helps tremendously when using new technologies to avoid outdated results.
Post Reply