在IE中使用我的頁眉時出現CSS問題

我在以下網站上工作：http://tcsdesignreno.com/nvvolunteers/。在IE中使用我的頁眉時出現CSS問題

它在Firefox和Chrome中看起來很棒，但是當我到Internet Explorer的主頁時，它將導航菜單和左側的社交媒體圖標一起放下（請參閱下圖）。任何人都可以幫我找到我的CSS代碼中的錯誤，所以它會在所有瀏覽器中看起來是正確的。

我在IE 10中測試，但在以後的版本中有相同的問題。

我認爲問題來自社交媒體領域CSS中的頂部邊緣，但我無法弄清楚如何將其置於導航欄上方而不使用此代碼。

可能的HTML代碼

<div class="social-media-home"> 
       <a title="Follow us on Facebook" href="https://www.facebook.com/NevadaVolunteers" target="_blank"> 
        <img class="alignleft size-medium wp-image-924" title="Follow us on Facebook" alt="Facebook" src="http://tcsdesignreno.com/nvvolunteers/wp-content/uploads/2013/05/facebook.png" width="32" height="32" /> 
       </a> 
       <a title="Check us out on Twitter" href="https://twitter.com/nvvolunteers" target="_blank"> 
        <img class="alignleft size-medium wp-image-922" title="Follow us on Twitter" alt="Twitter" src="http://tcsdesignreno.com/nvvolunteers/wp-content/uploads/2013/05/twitter.png" width="32" height="32" /> 
       </a> 
       <a title="Pin us on Pinterest" href="http://pinterest.com/nvvolunteers/" target="_blank"> 
        <img class="alignleft size-full wp-image-921" title="Pin us on Pinterest" alt="Pinterest" src="http://tcsdesignreno.com/nvvolunteers/wp-content/uploads/2013/05/pinterest.png" width="32" height="32" /> 
       </a> 
       <a title="See us on Instagram" href="http://instagram.com/nvvolunteers#" target="_blank"> 
        <img class="alignleft size-medium wp-image-923" title="See us on Instagram" alt="Instagram" src="http://tcsdesignreno.com/nvvolunteers/wp-content/uploads/2013/06/instagram_64x64.png" width="32" height="32" /> 
       </a> 
       <a href="#" target="_blank"> 
        <img class="alignleft size-full wp-image-926" style="display: none;" title="Add us on Google +" alt="Google Plus" src="http://tcsdesignreno.com/nvvolunteers/wp-content/uploads/2013/05/GooglePlus.png" width="32" height="32" /> 
       </a> 
       <a href="#" target="_blank"> 
        <img class="alignleft size-medium wp-image-925" style="display: none;" title="Find us on Linked In" alt="LinkedIn" src="http://tcsdesignreno.com/nvvolunteers/wp-content/uploads/2013/05/linkedin.png" width="32" height="32" /> 
       </a> 
       <a href="#" target="_blank"> 
        <img class="alignleft size-medium wp-image-923" style="display: none;" title="Watch us on YouTube" alt="YouTube" src="http://tcsdesignreno.com/nvvolunteers/wp-content/uploads/2013/05/youtube.png" width="32" height="32" /> 
       </a>     
      </div> 

      <div id="home-nav-container"> 
      <div class="resizer"><span id="font-resizer-ticker"></span></div> 

      <div id="home-nav"><?php wp_nav_menu(array('menu' => '5')); ?></div> 
      </div>

可能的CSS代碼

.social-media-home { 
    position:relative; 
    float: right; 
    margin: 4.2rem 0.5rem 0 0; 
    clear:right; 
} 

.social-media-home img { 
    margin: 1rem 5px 0 0!important; 
} 

#home-nav-container { 
float: right; 
text-align: right; 
clear: right; 
} 
#home-nav { 
    float: right; 
    padding: 0.8rem 1.0714rem 0 0; 
} 

#home-nav li{ 
    display: inline-block; 
    font-weight:bold; 
} 
#home-nav li a{ 
    text-decoration:none; 
} 

#home-nav li:not(:last-child):after 
{ 
    content: ' |'; 
} 

.resizer { 
    /*clear:right;*/ 
    float:right; 
    padding: 0.8rem 1.0714rem 0 0; 
}

截屏

IE Nav Problems