Placering af DIV Chrome + Safari vs Firefox

Hej,

Jeg har en del problemer med at få nogle elementer placeret i højden på siden. i Firefox er elementerne placeret lige en smugle under i forhold til Chrome og Safari.
Håber nogen lige vil tjekke min kode og se hvad fejlen evt kan være.
HTML:
<div id="header">
            <h1><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
            <div class="menu">

                <?php $main_pages = get_pages( array('sort_order' => 'DESC','sort_column' => 'menu_order','exclude' => array(11),'post_type' => 'page', 'post_status' => 'publish','parent' => 0) );
                foreach( $main_pages as $main_page ) {
                echo "<div class='menu_item' id='menu_item_".$main_page->ID."'>".$main_page->post_title."<div id='submenu_items_".$main_page->ID."'>";
               
                $sub_pages = get_pages( array('child_of' => $main_page->ID,'sort_order' => 'DESC','sort_column' => 'menu_order','post_type' => 'page', 'post_status' => 'publish') );
                foreach( $sub_pages as $sub_page ) {
                echo "<div class='submenu'><a href='".get_page_link($sub_page->ID)."'>".$sub_page->post_title."</a></div>";
                }
               
                echo "</div></div>";
           
                }
                ?>
            </div>
        </div>

CSS:
#header { height:75px; background-color:#fff; margin-left:20px; margin-right:20px; padding-top:10px; border-bottom: 1px solid #000;}
.menu { position:relative; top:13px; width:950px; height:11px;}
.menu_item { position:relative; width:475px; float:left; cursor:pointer;}
.submenu { position:relative; float:right; margin-left:20px;}
#submenu_items_183 { position:relative; top:-11px; left:-300px;}
#submenu_items_188 { position:relative; top:-11px; left:-285px;}