没有包装的DIV并排

Question

我的病历有点问题。

我有一个固定的容器，这个容器中的.gantt-chart是一行.gantt-row。在这一行中有两个包装器(.gantt-columns-wrapper，.gantt-sub-columns-wrapper)，用于用绝对位置分层列。

position: absolute;
left: 0;
top: 0;

包装器中有列和子列.我想要卷轴，但它们被包裹住了吗？有什么解决办法吗？

the 小提琴

​

​

Answer 1

我编辑的小提琴是你想要的吗？

我更改了边框颜色，这样就可以看到哪个元素在哪里。

我添加了white-space: nowrap

.gantt-sub-column-wrapper, .gantt-column-wrapper {
    position: absolute;
    left: 0;
    top: 0;
    white-space: nowrap

}

和overflow: auto

.gantt-chart {
    height: 200px;
    position: relative;
    width: 200px;
    border: 1px solid #000000;
    overflow:auto;
}

Answer 2

将此添加到CSS中。

.gantt-chart {
    overflow-y: scroll;
}