We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 29201
    • 239 Posts
    I’m very close to having my AjaxSearch text field and submit buttons look exactly like they should.......BUT........it appears that there is some text or the default submit button sitting on top of my pretty blue custom submit button.

    Here’s what I’ve done so far to achieve these results: http://fairview-condo.com/index.php?id=1

    1. Added in my snippet call to the header file <p id="search-box"> [!AjaxSearch? &ajaxSearch=`0` &AS_showResults=`0` &AS_landing=`9`!] </p>

    2. Added these 3 styles into my CSS (#ajaxSearch_form,#ajaxSearch_input,#ajaxSearch_submit)

    Now my CSS looks like the following:

    p#search-box, #ajaxSearch_form{
    float:right;
    position:relative;
    top:40px;
    z-index:1111;
    width:auto;
    }
    p#search-box input, #ajaxSearch_input, p#search-box2 input{


    width:235px;
    padding:3px 5px;
    height:18px;
    color:#111;
    float:left;
    border:none;
    background-image: url(../images/search-input-bg.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-color:#000;

    }
    p#search-box #submit, #ajaxSearch_submit, p#search-box2 #submit{
    border:none;
    background-image: url(../images/go.png);
    background-repeat: no-repeat;
    background-position: center center;
    width:41px;
    height:24px;
    cursor: pointer;

    }
    p#search-box #submit:hover, #ajaxSearch_submit:hover, p#search-box2 #submit:hover{
    border:none;
    background-image: url(../images/go-ho.png);
    background-repeat: no-repeat;
    background-position: center center;
    width:41px;
    height:24px;
    cursor: pointer;

    }

    This places the Search form exactly where it needs on the page text/input field looks fine. However, as you can see from the link above there is some strange "Go!" text covering the submit button. As well it appears that the transparency it not working.

    Here is the original HTML for the search form:

    <p id="search-box"><input type="text" /> <input name="submit" type="button" value="" id="submit" /></p>

    It would be great if I could just modify the CSS to fix this. Or do I need to use &tplLayout in my snippet and do all the styling there? I’ve not had success chunking the formatting.

    Thanks in advance,

    Eliot
      • 4310
      • 2,310 Posts
      If you look in assets/snippets/AjaxSearch/lang/english.inc.php on/around line 11.