表格或列表中的水平滚动条答案

【问题标题】：horizontal scrollbar in table or list表格或列表中的水平滚动条
【发布时间】：2017-01-26 23:20:37
【问题描述】：

是否有机会拥有三方行，其中第一列和第三列的固定宽度为 100px，第二列是响应式的？当我尝试使用表格时，如果第二列小于 500 像素，则不再出现水平滚动条。当我尝试一个列表（float: left 或 display: inline-block）时，同样的问题。

#div_scroll {
    width: auto;
    height: 50px;
    border: 1px solid black;
    overflow-x: auto;
    overflow-y: hidden;
}

#p_scroll {
	width:500px
}

<div id="div_scroll">
  <p id="p_scroll">
    m ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut kasd gubergren, no sea takimata sanctus est Lorem ipsum
  </p>
</div>

【问题讨论】：

标签： html css scrollbar

【解决方案1】：

p_scroll 需要大于 div_scroll 才能工作。

换句话说：可滚动 DOM 中的 DOM 需要更大才能显示滚动条。

【讨论】：

【解决方案2】：

查看这个讨论水平滚动条的页面，here。

我认为你根本不想要那个 p_scroll，或者将溢出的东西移到 p_scroll 中，因为你有一件事说自动宽度，另一件事将宽度设置为特定数量。

像该页面上列出的一样，您还需要添加white-space: nowrap;

【讨论】：