IE中水平滚动区域的问题？答案

【问题标题】：Problem with Horizontal scrolling area in IE?IE中水平滚动区域的问题？
【发布时间】：2009-10-27 23:45:39
【问题描述】：

我有以下标记：

<div id="routes">

<ul id="routesList">
  <li class="routes">Route 1</li>
  <li class="routes">Route 2</li>
  <li class="routes">Route 3</li>
</ul>

</div>

使用以下 CSS：

#routes {
     height:20px;
     width:770px;
     overflow:hidden;
 }

ul.routesList{
    margin:0;
    padding:0;
    list-style:none;
    float:left;
    width:auto;
}

我有一些 javascript 滚动#routes div。

ul.routesList 列表项水平呈现并溢出，但在 IE 中它们在 IE 中垂直换行和溢出？

我尝试过使用自动换行，但没有成功！

这里有什么 IE 怪癖或者我的 CSS/HTML 有什么问题吗？？

谢谢

【问题讨论】：

标签： html css

【解决方案1】：

您已在列表中添加了一个 id，但在您的 CSS 中按类引用了它 - 我在下面放置了一些有效的 CSS，可以按照您在 IE 和 Firefox 中描述的那样工作。

#routes {
     height:20px;
     width:770px;
     overflow:hidden;
      background-color: Aqua;
 }

#routesList{
    margin:0;
    padding:0;
    list-style:none;
    width:auto;
}

#routesList li {
    float: left;
    width: auto;
    padding: 0 10px;
}

【讨论】：