Search box style

  • My theme has some CSS available for search form. I want to use this to style my input box so that search_bg.gif shows up inside it. How do I mark up my input box so it works? Do I put inside span tags? A form?

    /* Search form */
    .search { padding:0;}
    #search span { display:block; background:url(images/search_bg.gif) no-repeat left top; height:30px; margin:0; padding:0; border:none;}
    #search input#s { margin:0; padding:8px 10px; float:left; width:196px; color:#707070; font-size:12px; line-height:14px; font-weight:normal; background:none; border:none;}
    #search .btn { float:left; padding:0; margin

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter Thea G

    (@thea-g)

    This is what I tried to do but it just looks plain. (although it works)

    <span id=”search”><label for=”searchbox”>Search sessions by Presenter or Title… </label><input type=”text” placeholder=”Filter items…” size=”50″ onkeyup=”javascript:filterlist(this)”> </span>

    Your code pretty much explains it, lol

    #search span { display:block; background:url(images/search_bg.gif) no-repeat left top; height:30px; margin:0; padding:0; border:none;}

    And there goes the image.

    Would be better if you provide your site, otherwise I won’t be able to help. Cheers.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Search box style’ is closed to new replies.