search bar spacing problem in different browsers

  • I’m trying to add a search bar to my blog. It’s placed in the middle of two sets of text links at the very top, in a DIV (#navtop) seperate from the header image (in its own div #header). I set the CSS to height: 25px for #navtop and height: 100px for #header for a total height of 125px for the two areas stacked on top of each other. Everything is formatted properly if the search bar is NOT in the #navtop div. When it is in, the formatting is still good in MOZILLA FIREFOX, but everything gets pushed too low in OPERA, and everything is spaced out too far (high) in IE (the #navtop and #header divs increase in height creating an area with a height greater than 125px).

    Does anyone have any idea of why this would be the case? Here is the code for my search bar. I got it via the Google custom search page.

    <!– Search Google –>
    <form method=”get” action=”https://www.google.com/custom”&gt;

    Google<input type=”radio” name=”sitesearch” value=”google.com” checked=”checked”/>
    SpaceCadetz<input type=”radio” name=”sitesearch” value=”spacecadetz.com” checked=”checked”/>
    <input type=”text” name=”q” size=”20″ maxlength=”255″ value=””/>
    <input type=”submit” name=”sa” value=”Search”class=”btn”/>
    <input type=”hidden” name=”cof” value=”GALT:green;S:https://www.spacecadetz.com;VLC:blue;AH:center;BGC:white;LC:blue;GFNT:blue;ALC:green;T:black;GIMP:green;AWFID:cb78543507f4b024;”/&gt;
    <input type=”hidden” name=”domains” value=”google.com; spacecadetz.com”/>

    </form>
    <!– Search Google –>

Viewing 1 replies (of 1 total)

  • Hard to tell. IE treats height more like min-height, but that wouldn’t explain Opera.

    But is there a reason you’ve set a height for those header elements? I tested your page with

    #header, #navtop, #navmenu { height: auto;}

    and it looked mostly the same. #navmenu was shorter, but you can just add vertical padding to it:

    #navmenu{ padding: 0.5em 0;}

Viewing 1 replies (of 1 total)
  • The topic ‘search bar spacing problem in different browsers’ is closed to new replies.