Search bar is not showing on page

Question

before I added the facebook logo image, in its place I just had a p tag with the name of the page. When I had it like that, the search bar at the top right was visible just fine. When I removed the p tag and added the logo.jpg as a link to my index.php, the search bar disappeared. I can't figure out what is wrong with my code. Here is the header:

 <header id="head">
            <!-- logo goes here -->
            <a href="index.php">
            <img src="images/logo.jpeg" alt="Home"> <!-- For now its facebook's logo. Don't have my own -->
            </a>
            <!-- Search box -->
        <form id="idbsearch" method="get" action="http://www.google.com">
            <input type="text" class="idbtextinput" name="q" size="21" maxlength="120">
            <input type="submit" value="search" class="idbbutton">
            <div id="advanced_search">
                <a href="advanced_search.php">Advanced Search</a>
            </div>
        </form>
        <div class="idbclear">
        </div>
    </header>

Here is the related css:

/* header */
header#head
{
    background-color: #333332;
    height: 100px;
    width: 110%;
    margin-top: -20px;
    margin-left: -10px;
}

header#head p
{
    font-family: Helvetica, sans-serif;
    font-size: 20px;
    color: #789;
    font-weight: bold;
    padding: 20px;
}

header#head p
{
    color: #889;
}

header#head a
{
    margin-top: 60px;
    margin-left: 60px;
}

header#head a img
{
    width: 200px;
    margin-top: 20px;
}

/* search bar */
#idbsearch
{
    float:right;
    padding:20px;
    margin-right: 200px;
    margin-top: -90px;
}

.idbtextinput
{
    margin: 5px;
    margin-right: -5px;
    padding: 5px 15px;
    font-family: Helvetica, sans-serif;
    font-size:14px;
    border:1px solid #0076a3; border-right:0px;
    border-top-left-radius: 5px 5px;
    border-bottom-left-radius: 5px 5px;
}

.idbbutton 
{
    margin: 0;
    padding: 5px 15px;
    font-family: Arial, Helvetica, sans-serif;
    font-size:14px;
    outline: none;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    color: #ffffff;
    border: solid 1px #0076a3; border-right:0px;
    background: #0095cd;
    background: -webkit-gradient(linear, left top, left bottom, from(#00adee),         to(#0078a5));
    background: -moz-linear-gradient(top,  #00adee,  #0078a5);
    border-top-right-radius: 5px 5px;
    border-bottom-right-radius: 5px 5px;
}

.idbbutton:hover
{
    text-decoration: none;
    background: #007ead;
    background: -webkit-gradient(linear, left top, left bottom, from(#0095cc),         to(#00678e));
    background: -moz-linear-gradient(top,  #0095cc,  #00678e);
}        

/* Fixes submit button height problem in Firefox
.idbbutton::-moz-focus-inner 
{
        border: 0;
}
*/

.idbclear
{
    clear:both;
}

#advanced_search
{
    padding: 10px;
    margin-top: -10px;
}

#advanced_search a:link
{
    color: #999;
}

#advanced_search a:visited
{
    color: #9D5F9D;
}

#advanced_search a:hover
{
    color: #4A4ACC;
}

Thanks in advance!!

Answer 1

Remove:

margin-top: -90px;

From #idbsearch for it to show up.

DEMO