CSS search box problem?

Discussion in 'Web Design and Development' started by kclimson, Mar 13, 2012.

  1. kclimson macrumors newbie

    kclimson

    Joined:
    Aug 15, 2011
    Location:
    Canada
    #1
    Hey, I have a search box on my website www.macview.ca but I can't position it to be near the icons. Please help.
    The search box code.

    <form method="get" id="searchform"
    action="<?php bloginfo('url'); ?>/">
    <label class="hidden"
    for="s"><?php _e(''); ?></label>
    <div id="searchthingy">
    <input type="text" value="<?php the_search_query(); ?>"
    name="s" id="search" />
    </div>
    </form>


    And the CSS
    .
    .



    /* Search Bar
    ----------------------------------------------------------------------------------------------------*/
    #header form
    position: relative;
    float: right;
    top: 2.5px;
    right: 270px;

    header form p {
    font-weight: bold;
    text-transform: uppercase;
    text-shadow: 0 -1px 0 black;

    }

    header input {

    background: url(../img/searchIcon.png) 98% 48% no-repeat, -webkit-gradient(
    linear,
    left top, left bottom,
    from(#DAE2EA), to(#FFFFFF));
    border: 1px solid #206577;
    color: #000000;



    -moz-box-shadow: inset 0 -4px 9px rgba(0,0,0,.4);
    -webkit-box-shadow: inset 0 -4px 9px rgba(0,0,0,.4);
    box-shadow: inset 0 -4px 9px rgba(0,0,0,.24);
    }




    }
    Please help
     
  2. Darth.Titan macrumors 68030

    Darth.Titan

    Joined:
    Oct 31, 2007
    Location:
    Austin, TX
    #2
    That's not the CSS that's loading on your page. What I'm getting is:
    Code:
    header form {
        float: right;
        margin-top: 4px;
        padding-top: 4px;
        position: absolute;
        top: 1px;
    }
    If you'll just add
    right: 356px;
    to that block you should get what you want.
     
  3. kclimson thread starter macrumors newbie

    kclimson

    Joined:
    Aug 15, 2011
    Location:
    Canada
    #3

    thanks :dd
     

Share This Page