滚动条在 IE7 中不滚动 div 内容（IE8 兼容性）答案

【问题标题】：Scrollbar doesn't scroll div content in IE7 (IE8 Compatibility)滚动条在 IE7 中不滚动 div 内容（IE8 兼容性）
【发布时间】：2011-12-03 05:14:02
【问题描述】：

我在 IE7 中遇到了一个奇怪的问题（我的意思是 IE8 兼容模式），div 中的滚动条出现在其内容的后面。它位于一个 jQueryUI 模态对话框中，占据了大部分屏幕并且里面有很多东西。 div 包含一个ASP:Repeater，它以网格样式布局呈现自定义行。

div 的完整标记如下：

<div style='max-height:250px; overflow-y:scroll;
border:1px solid #AAAAAA; border-top-width:0; margin-left:auto;
margin-right:auto;'>
  <asp:Repeater ID="myRepeater" runat="server">
     <ItemTemplate>
        <asp:Panel ID="pnlItem" runat="server" style='padding-top:5px;
           padding-bottom:5px; position:relative;'>
           .....
        </asp:Panel>
     </ItemTemplate>
  </asp:Repeater>
</div>

这是问题的屏幕截图。覆盖垂直滚动条的灰色是通过pnlItem 上的类设置的交替背景颜色。下面的文字（“H.S. Gym”）是中继器底部pnlItem 的一部分。此外，当我移动其中一个滚动条时，内容不会移动，直到我移动模态对话框。

我不知道在这里做什么。这似乎是一个非常随机的渲染错误，将有一个同样随机的解决方案。谷歌没有任何帮助。这是怎么回事？

编辑 10/7/2011：我通过在 div 上设置显式宽度解决了重叠滚动条问题。现在垂直滚动条在 IE7 中正确显示，但是当我使用它滚动时，内容的滚动位置不会更新，直到我通过其标题栏抓住模态并将其移动到浏览器屏幕中。我已更新此问题的标题以反映这一点。

【问题讨论】：

标签： asp.net internet-explorer-7

【解决方案1】：

原来问题出在每个Repeater 项目根目录的pnlItem 控件上的position:relative。在 IE7 中，这会导致滚动条不起作用。我有那个设置，所以我可以在每个 pnlItem 中获得一些布局内容来工作，但我最终做了不同的事情，所以能够删除那个样式属性并让它工作。

【讨论】：