列出的项目将不会显示在IE 9

Question

我在这里完全损失，我有两个名单漂浮在我的网站的标头旁边，显示当前用户的信息和统计信息登录的徽标。

Masthead ______________________________________________________ 
|    Navbar_________________________________________ | 
| logo  |            | | 
|   |linklist leftside   linklist rightside | |          
|   |            | | 
|   |_______________________________________________| | 
|                | 
|_______________________________________________________________| 

我的HTML和CSS是直截了当的，但是由于某些原因，列表不会显示在IE9中。他们在Firefox和Chrome中完美展现。我一直在拉我的头发，试图让他们出现。我可以在列表中看到几个单词的顶部，但之后他们会切断。我不确定它是否与溢出问题有关，也可能是我的if语句有点关闭，但是如果它们在其他浏览器中显示正常，我不会看到有什么问题。

的HTML：

<div class="masthead"> 
    <div class="inner"> 
     <div id="site-description"> 
     <a href="{U_INDEX}" title="{L_INDEX}" id="logo">{SITE_LOGO_IMG}</a> 
      <h1>{SITENAME}</h1> 
     </div> 
     <div class="navbar"> 
      <div class="inner"> 
      <!-- IF not S_USER_LOGGED_IN and not S_IS_BOT --> 
      <form method="post" action="{S_LOGIN_ACTION}" class="headerspace"> 
       <fieldset class="quick-login"> 
        <label for="username">{L_USERNAME}:</label>&nbsp;<input type="text"   
         name="username" id="username" size="10" class="inputbox" title=" 
         {L_USERNAME}" /> 
        <br/> 
        <label for="password">{L_PASSWORD}:</label>&nbsp;&nbsp;<input type="password" 
        name="password" id="password" size="10" class="inputbox" title=" 
        {L_PASSWORD}" /> 
        <br/> 
        <!-- IF S_AUTOLOGIN_ENABLED --> 
        <label for="autologin">{L_LOG_ME_IN} <input type="checkbox" name="autologin" 
        id="autologin" /></label> 
        <!-- ENDIF --> 
        <input type="submit" name="login" value="{L_LOGIN}" class="button2" /> 
        {S_LOGIN_REDIRECT} 
       </fieldset> 
       </form> 
       <!-- ENDIF --> 
       <!-- IF not S_IS_BOT and S_USER_LOGGED_IN --> 
       <ul class="linklist leftside"> 
        <li class="logout"> 
        <a href="{U_LOGIN_LOGOUT}" title="{L_LOGIN_LOGOUT}" accesskey="x"> 
         {L_LOGIN_LOGOUT}</a> 
        </li> 
        <li class="ucp"> 
        <a href="{U_PROFILE}" title="{L_PROFILE}" accesskey="e">{L_PROFILE}</a> 
        </li> 
        <li class="pm"> 
        <!-- IF S_DISPLAY_PM --> (<a href="{U_PRIVATEMSGS}">{PRIVATE_MESSAGE_INFO} 
        </a>)<!-- ENDIF --> 
        </li> 
        <li class="posts"> 
         <!-- IF S_DISPLAY_SEARCH --> 
       <a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a> 
       <!-- ENDIF --> 
        </li> 
        <li class="permissions"> 
        <!-- IF U_RESTORE_PERMISSIONS --> 
       <a href="{U_RESTORE_PERMISSIONS}">{L_RESTORE_PERMISSIONS}</a> 
       <!-- ENDIF --> 
        </li> 
       </ul> 
       <!-- ENDIF --> 

       <ul class="linklist rightside"> 
        <li class="visit"> 
         <!-- IF S_USER_LOGGED_IN -->{LAST_VISIT_DATE}<!-- ENDIF --> 
        </li> 
        <li class="time"> 
         <!-- IF U_MCP -->{CURRENT_TIME} [&nbsp;<a href="{U_MCP}">{L_MCP}    
         </a>&nbsp;]<!-- 
         ELSEIF S_USER_LOGGED_IN -->{CURRENT_TIME}<!-- ENDIF--> 
        </li> 
        <li class="faq"> 
         <a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}">{L_FAQ}</a> 
        </li> 
         <!-- IF not S_IS_BOT --> 
       <!-- IF S_DISPLAY_MEMBERLIST --> 
        <li class="members"><a href="{U_MEMBERLIST}" title=" 
        {L_MEMBERLIST_EXPLAIN}">  
        {L_MEMBERLIST}</a></li><!-- ENDIF --> 
        <!-- ENDIF --> 
       </ul> 
     </div> 
     </div> 
    </div>  
</div> 

的CSS：

#logo { 
    float: left; 
    width: auto; 
    margin-top: -60px; 
    margin-left: 20px; 
} 
.masthead { 
    color: #FFFFFF; 
    margin-bottom: 0px; 
    margin-top: 25px; 
    width: 96%; 
    min-width: 650px; 
    margin-right: auto; 
    margin-left: auto; 
    height: 130px; 
    background-repeat: repeat-x; 
    background-position: 0 0; 
} 
.navbar { 
    padding-right: 10px; 
    padding-left: 10px; 
    margin-top: 0px; 
    margin-bottom: auto; 
    margin-left: 480px; 
    margin-right: 20px; 
    height: 86px; 
} 
.linklist.leftside { 
    float:left; 
    text-align: left; 
    list-style-type: none; 
    display: inline; 

} 
.linklist.rightside { 
    float:right; 
    text-align: right; 
    list-style-type: none; 
    margin-left: 20px; 
    display: inline; 
} 

我更注重的是CSS，我不认为这个问题是我的HTML虽然我可能是完全错误。任何建议将不胜感激，谢谢！

Answer 1

您是否在页面顶部声明了您的文档类型？ IE浏览器需要这个......

Answer 2

不知道，但尝试此更新

.navbar { float:right; padding:0px 10px; margin: 0px 20px 0 0; background:blue; 
      width:60%; overflow:hidden;} 
      /**/ 
     } 

调整所需的宽度。

尽量避免使用高度可能夹扩展数据+避免保证金玩，它与恶化的浏览器兼容性的工作，即使是和非传统的浏览器

它应该工作...