Support » Themes and Templates » Design a search form with css my purpose is to have searchform text like arte

  • Hello


    I decided to design a search form on my website
    the first searchform is this :

    you can see it on
    <div id="search">
    <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="get" name="searchform" id="searchform">
    <input type="text" name="s" id="s"  value="Rechercher" />
    <input type="image" alt="submit" src="/wp-content/themes/oupocreanum/images/return.gif"/>

    and the original css is this `#search {
    position: absolute;
    top: -24px;
    right: -16px;
    margin: 0px;
    margin-top: 0px;

    #s {
    width: 150px;
    height: 17px;
    background-image: url(/wp-content/themes/oupocreanum/images/loupe.gif);
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: dotted;
    border-right-style: dotted;
    border-bottom-style: dotted;
    border-left-style: dotted;
    border-top-color: grey;
    border-right-color: grey;
    border-bottom-color: grey;
    border-left-color: grey;
    vertical-align: text-bottom;

    #search label {
    display: none;

    #search h2, #search form {
    display: inline;

    But i decided to modify code like this :
    <div id="search">
    <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="get" name="searchform" id="searchform" />
    <input type="text" name="s" id="s" value="Rechercher" maxlength="255" style="" onClick="this.value='';"onblur="if(this.value=='') this.value='Rechercher';" onfocus="if(this.value=='Rechercher') this.value='';" /></div>
    <input type="image" alt="submit" src="/wp-content/themes/oupocreanum/images/return.gif"   />

    But my purpose is to have two box one for searchform with picture on background and one for text But actually I don’t know,I search to have a separation between searchform background and searchform text like search form

    Can you help me for making good scripting or good css to have a good effect on text position?

  • The topic ‘Design a search form with css my purpose is to have searchform text like arte’ is closed to new replies.