form element question

Here's my page with three separate forms:
http://www.shnorrer.com/category.htm

here's a snippet of the stylesheet determining the form element styles:

INPUT, TEXTAREA {
font-family: Verdana, Arial, Helvetica, sans-serif;
padding: 1px;
font-size: 11px;
color: #000000;
background-color: #DDFF9C;
}

Two questions...

One, how can I remove the green around the radio buttons so it blends with a
white background (see center box middle of page)?

Second - why in the world does the graphical submit button on the newsletter
sign up have a box around it and the graphical "go" button at the top right
does not? I know it's stylesheet related since when I remove the
stylesheet, both submit buttons look ok - no ugly box around them!

OH!! Thanks for any help - kinda new to this.......
Marita

"M.C.S." <marita (AT) thedesigndept (DOT) com> wrote:

Here's my page with three separate forms:
http://www.shnorrer.com/category.htm

Fix the errors before asking for help here.
http://validator.w3.org/check?uri=ht...m/category.htm
It stops us being grumpy and means you don't run the risk of looking
foolish if it's a simple error in coding.

here's a snippet of the stylesheet determining the form element styles:

INPUT, TEXTAREA {
font-family: Verdana, Arial, Helvetica, sans-serif;
padding: 1px;
font-size: 11px;
color: #000000;
background-color: #DDFF9C;
}

Two questions...

One, how can I remove the green around the radio buttons so it blends with a
white background (see center box middle of page)?

In theory
input[type="radio"] {background-color: transparent;}
(actually as browsers have different ideas about what the background
of some form elements is it might be better to only set the background
on those types you want to have one -
input[type="text"], textarea {background-color: #DDFF9C;}

In practice (as IE doesn't support the above) use classes.

Second - why in the world does the graphical submit button on the newsletter
sign up have a box around it and the graphical "go" button at the top right
does not?

Neither have a box around them in Opera 7.54. Both have a box around
them in IE6 and FF1.

IE and FF are right. All input elements have a 1px padding and a
background colour. So why shouldn't those graphical buttons have a 1px
space around their content showing the background colour? It's what
you've told the browsers to do.

input[type="image"] {padding: none;}

Again in practice you need to use classes.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <steve (AT) pugh (DOT) net> <http://steve.pugh.net/>

kchayka <usenet (AT) c-net (DOT) us> wrote:

Steve Pugh wrote:

input[type="image"] {padding: none;}

Methinks {padding: 0;} might work better.

Methinks you're probably right. Whoops.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <steve (AT) pugh (DOT) net> <http://steve.pugh.net/>