DIV并排没有包裹

Question

我的图表有点问题。

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

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

包装器中的

是列和子列。 我想滚动但是它们被包裹了？对此有何解决方案？

fiddle

Answer 1

我编辑了fiddle 那是你想要的吗？ 我更改了边框颜色，以便可以看到哪个元素在哪里

我添加了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;
}