Advertisement
If you have a new account but are having problems posting or verifying your account, please email us on hello@boards.ie for help. Thanks :)
Hello all! Please ensure that you are posting a new thread or question in the appropriate forum. The Feedback forum is overwhelmed with questions that are having to be moved elsewhere. If you need help to verify your account contact hello@boards.ie

Help with header file and css

Options
  • 29-11-2014 9:26pm
    #1
    Closed Accounts Posts: 431 ✭✭


    so i have been working on my new wordpress blog locally with lamp and i have everything set up the way i want it but i wanted to add a search bar on the header so i added this code to the header.php file:

    [PHP]<form method="get" id="searchform" action="<?php bloginfo('home'); ?>/">
    <div><input type="text" size="18" value="<?php echo wp_specialchars($s, 1); ?>" name="s" id="s" />
    <input type="submit" id="searchsubmit" value="Search" class="btn" />
    </div>
    </form>[/PHP]

    and it works but me question is how do i reference that code in css as i want move it around. Can anyone help me out?


Comments

  • Registered Users Posts: 2,797 ✭✭✭mightyreds


    if you just give your div an id <div id="form"> then in the css its just
    #form{ position:absolute; 
    left:500px; 
    top:30px; }
    

    that should move it somewhere in the centre as an example
    or else I didnt see your id=searchform at the start so it will work like this in the css without adding anything to the div tag
    #searchform{ position:absolute; 
    left:500px; 
    top:30px; }
    


  • Closed Accounts Posts: 431 ✭✭whats newxt


    I'm afraid that not working for me but it's ok i figured it out anyway. It was already reference as follows. I still don't understand why.

    input[type="text"],
    input[type="email"],
    input[type="url"],
    input[type="password"],
    input[type="search"] {
    position:fixed;
    margin-bottom: auto;
    right:0;
    z-index:20;
    margin-top:7px;
    margin-right:27px;
    border: 1px solid #ffffff;
    background-color: #353535;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    max-width: 100%;
    padding: 10px;


Advertisement