html - CSS 选项卡在 IE 中位于左侧，但在 Mozilla 中它们居中。IE 有解决办法吗？

Question

标签完美地工作。我只是在 IE 中的位置有问题。在 Mozilla 中，它完美地显示了选项卡的位置，但是当我在 IE 中加载页面时，它会将选项卡移动到选项卡所在的表格的完整左侧。

这是我的 CSS 代码：

 a:active {
outline: none;
 }
 a:focus {
-moz-outline-style: none;
 }
 #tabs_container {
width: 626px;
font-family: Arial;
font-size: 10px;
}
 #tabs_container ul.tabs {
list-style: none;
border-bottom: none;
height: 25px; 
margin: 0px;

  }
  #tabs_container ul.tabs li {
 float: left;
   }
  #tabs_container ul.tabs li a {
padding: 6px 9px;
display: block;
border-left: 1px solid #90afcb;
border-top: 1px solid #90afcb;
border-right: 1px solid #90afcb;
border-bottom: 1px solid #90afcb;
margin-right: 4px;
text-decoration: none;
background-color: #ffffff;
    }
    #tabs_container ul.tabs li.active a {
background-color: #90afcb;
padding-top: 6px;
    }
   div.tab_contents_container {
border: none;
border-top: none;
padding: 10px;
font-size: 10px;
    }
    div.tab_contents {
display: none;
    }
    div.tab_contents_active {
display: block;
    }
    div.clear {
clear: both;
    }

HTML

  <!-- These are the tabs -->
  <ul class="tabs">
    <li class="active">
      <a href="#" rel="#tab_1_contents" class="tab"><span>Dienstleistung | Services</span></a>
    </li>
    <li><a href="#" rel="#tab_2_contents" class="tab"><span>Über uns | About us</span></a></li>
    <li><a href="#" rel="#tab_3_contents" class="tab"><span>Netzwerken | Networking</span></a></li>
    <li><a href="#" rel="#tab_4_contents" class="tab"><span>Social Media</span></a></li>
    <li><a href="#" rel="#tab_5_contents" class="tab"><span>Impressum</span></a></li>
  </ul>

如果您能提供任何帮助，我将不胜感激。非常感谢

Answer 1

嗨，您是否尝试添加float #tabs_container ul.tabs和#tabs_container ul.tabs li a

#tabs_container ul.tabs {
     float:left;
    border:1px solid red;
list-style: none;
border-bottom: none;
height: 25px; 
margin: 0px;

  }

  #tabs_container ul.tabs li a {
float:left;
padding: 6px 9px;
display: block;
border-left: 1px solid #90afcb;
border-top: 1px solid #90afcb;
border-right: 1px solid #90afcb;
border-bottom: 1px solid #90afcb;
margin-right: 4px;
text-decoration: none;
background-color: #ffffff;
    }