Question

I am using wordpress twentyten theme.
and in this i have set search widget.

Now i want to customize my search option which look like,

and i want to chane it like,

Can any one tell me where i have to change?

Answer 1

The php for the wordpress search form is <?php get_search_form(); ?> which writes out the following in the browser

<form method="get" id="searchform" action="http://www.your-url.org.uk/">
<div><label class="screen-reader-text" for="s">Search for:</label>
<input type="text" value="" name="s" id="s">
<input type="submit" id="searchsubmit" value="Search">
</div>
</form>

So you’d need to find #searchform in your theme’s stylesheet and then customize the css from there. If you need more help try downloading firebug and using it to inspect the existing Css.