Twenty Eleven
Change border and text color of search widget (4 posts)

  1. ipardoe
    Posted 3 years ago #

    I'm using a twentyeleven child theme and I am having trouble changing the border and text color of a search widget I've put into the footer (I've removed the search from the header). I thought adding the following to style.css in my child theme would work:

    .widget_search #searchsubmit {
    	border: 1px solid #B8753D; /* brown */
    	color: #DF9B62; /* light orange */

    Sadly not. Any help gratefully appreciated. Site URL: http://kusikawsay.org/wp/


  2. Michael
    Forum Moderator
    Posted 3 years ago #

    try to work with a browser inspection tool such as Firebug http://getfirebug.com/ to identify the involved styles;

    in your case:

    .widget_search input#s
  3. ipardoe
    Posted 3 years ago #

    Thanks alchymyth. I only just started using Firebug today and was having some trouble with it, but thanks to your suggestion I've persevered and figured out how to use it now. And the style you noted was indeed the culprit. However, while changing this style works to change the border and text color in Firefox, for some reason only the border changes in Chrome, while the text color remains grey. On checking IE the text ("Search") doesn't appear at all for some reason.

  4. ipardoe
    Posted 3 years ago #

    After investigating further, changing the text color for this style applies correctly to any text that is typed into the text box (in Chrome, Firefox, and IE). However, the word "Search" that appears in the search box before you type anything is the specified color only in Firefox. In Chrome it remains the default twentyeleven theme grey. In IE the word "Search" fails to appear at all. It's not really too big a deal, so I'm wondering if I might just have to live with this, but it is a little perplexing. Any ideas on whether there might be a fix?

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic