How to move searchbox cursor

  • Hi

    I have increased the width of my site’s searchbox which resulted in the ‘search’ text, clickable search button area and cursor position moving out of sync with the background image. I managed to fix the search text and clickable area in the stylesheet okay but i can’t make the cursor budge! My theme uses the following code for determining the various aspects of the search box, can someone please tell me which one is determining the cursor and what command to use/adjust to shift it to the left?

    .header .header-search-box
    .searchform
    .searchform fieldset
    .searchform #s
    .searchform #searchsubmit

    Any help is very much appreciated

Viewing 3 replies - 1 through 3 (of 3 total)

  • If you post a link to your site, someone may be able to help you with this.

    Thread Starter demoniality

    (@demoniality)

    https://www.nokia808pureviewdeals.co.uk

    The cursor is moved over because of the padding in this CSS:

    .searchform #s {
    background: none repeat scroll 0 0 transparent;
    border: medium none;
    padding-left: 95px;
    width: 142px;
}

    Try changing it to 25px — that puts in in the right place.

    Now, as you’ll see, there is a problem with the way the “Search” button looks. But that’s because you have it coded incorrectly in the HTML code. All you need to put in the HTML is this:

    ‘<input id=”searchsubmit” type=”submit” value=”Submit” />`

    The “value” in the above code is what appears on the button.

    See this for more on use of button tags:
    https://www.w3schools.com/tags/tag_button.asp

    So remove the following code and replace with the code above”
    <button id="searchsubmit" value="Search" type="submit">Search</button>

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How to move searchbox cursor’ is closed to new replies.