Spoke too soon :-(

[tnsbuff]

bfjacobs, I'm still having problems. Using input.text doesn't work when I try to format my text fields, nor does input.checkbox, etc.

It seems the only things I can format (aside from using inline styles or placing a class name in each field) are:

textarea {background-color: #cccccc}
select {background-color: #cccccc}
input {background-color: #cccccc}

Again, the problem with this is that my checkboxes and radio buttons end up with this background color around them and I just want them to be white like the rest of the page. It seems that this:

input.text {background-color: #cccccc}
input.checkbox {background-color: #ffffff}
input.radio {background-color: #ffffff}

... doesn't work.

I originally thought that they did because when I added input.text {background-color: #cccccc} and input.checkbox {background-color: #ffffff), my checkboxes went back to white, but it was not because of my style specification for input.checkbox, but rather because when I added .text after input (as in input.text) it removed all formatting for all input fields (which made the checkboxes white like the page background which is what I wanted.) But I noticed that my regular text fields lost their formatting also, so it seems that I can't format checkbox and radio button fields independently of other input fields, unless I specify a class in each field or use inline styles for each occurence.

Has anyone else found this to be true, or am I doing something wrong? It seems like there should be a way.

Thanks for any suggestions.

 

[bfjacobs]

You will have to put a class in the affected areas with the exception of the Select area. Below I've put exactly what I have in my form.

Here is my exact styles for the form:
SELECT {color: black; background: #e8e8e8 url('none');}
textarea {color: black; background: #e8e8e8 url('none');}
INPUT.text {color: black; background: #e8e8e8 url('none');}
INPUT.submit {color: black; background:#00bfff url('none'); font-weight: bold; border-width: 2px; border-color:#00bfff}
INPUT.reset {color: white; background: red url('none'); font-weight: bold; border-width: 2px; border-color:#00bfff}

Now, what I did for the Submit/Reset buttons was put then as follows:

INPUT TYPE="submit" VALUE=" Send " Class="submit"
input type="reset" value=" Clear " Class="reset"
The class is needed to make the changes.

The 'Select' style will make the the background of the drop down box the color that I have set up.

For the input fields, I have the following setup:
INPUT TYPE="text" NAME="first_name" MAXLENGTH=25 SIZE=25 Class="text"
You have to put the class in here also.

These should change the fields that you want to change.

Does this answer your question?

 

[tnsbuff]

Hi bfjacobs,

Actually, I have a multi-page form with loads of checkboxes, etc. and I was trying to avoid having to put classes in every checkbox and radio button field, plus the submit/reset fields, but maybe there's no alternative. I thought I could define them from the stylesheet alone, but I guess not.

Thanks!