How can I make an input box have a color rather then being plain?

[TinkerDesign]

My site is not yet online, developing it locally...
I would like to customise the search on the left side, like in : http://osc.template-help.com/zencart_24185/index.php

I see they use a seperate stylesheet (stylesheet_boxes.css)

Where would I assign that class to the search box?

Thank you

and would css buttons need to be on or off in my layout settings?

[niccol]

It can be styled in the same way as any other element.

It will be an <input> tag. To specify just that <input> tag you need its ID or a class, or the ID of a containing element.

Start with:

#searchContent input{background-color:red;}

You'll discover that this alters the input box and the button ( they are both <input>) To separate them out you are going to need to either 1. play around with the first-child selector in the css but this is buggy across browsers in my opinion. 2. Edit the code to add a ID or a class to one or both elements.

Or you could try this:

#searchContent input[type=text]{background-color:red;}

But I think this is buggy across browsers too so I would really recommend adding IDs or classes to the elements.

[niccol]

I have been to the dentist so am feeling a bit slow!

With css buttons enabled you may have more lock at separating the elements.


CSS buttons adds a class to the buttons so you can use that to discriminate between the button and the text input.

#searchContent input{background-color:red;}
.button_search{background-color:green !important;}

[TinkerDesign]

Thank you so much!!