Div只有水平滚动 [英] Div with horizontal scrolling only

问题描述

我有一个固定宽度DIV，其中包含有许多列的表，并且需要允许用户在DIV中水平滚动表。

这需要工作仅适用于IE6和IE7（内部客户端应用程序）。

以下适用于IE7：

  overflow-x：scroll; 
  

任何人都可以帮助一个在IE6工作的解决方案？

解决方案

解决方案是相当简单的。为了确保我们不会影响表格中的单元格宽度，我们将关闭白色空格。为了确保我们得到一个水平滚动条，我们将打开 overflow-x 。这很简单：

  .container {
 width：30em; 
 overflow-x：auto; 
 white-space：nowrap; 
} 
  

您可以看到

I have a fixed width DIV containing a table with many columns, and need to allow the user to scroll the table horizontally within the DIV.

This needs to work on IE6 and IE7 only (internal client application).

The following works in IE7:

overflow-x: scroll;

Can anyone help with a solution that works in IE6 as well?

解决方案

The solution is fairly straight forward. To ensure that we don't impact the width of the cells in the table, we'll turn off white-space. To ensure we get a horizontal scroll bar, we'll turn on overflow-x. And that's pretty much it:

.container {
    width: 30em;
    overflow-x: auto;
    white-space: nowrap;
}

You can see the end-result here, or in the animation below. If the table determines the height of your container, you should not need to explicitly set overflow-y to hidden. But understand that is also an option.

这篇关于Div只有水平滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！