使div对两个轴都可滚动

Question

我有一个固定的和高度的容器，里面有内容，可以扩展。如何使容器在两个轴上都可滚动？我可以为容器设置overflow-x/y隐藏，但它只适用于一个轴。下面是代码。

​

.timetable-container {
  position: absolute;
  margin-top: 30px;
  width: 1000px;
  height: calc(100vh - 120px - 30px);
  background: red;
  overflow-y: hidden;
}
.timetable-container .timetable-inner-container {
  position: absolute;
  top: 0;
  left: 0;
  width: auto;
  height: auto;
  display: flex;
  flex-direction: row;
}
.timetable-container .timetable-inner-container .timetable-day {
  width: 350px;
  height: 1200px;
  background: green;
}

<div class="timetable-container">
  <div class="timetable-inner-container">
      <div class="timetable-day">
        <h1 class="day">tuesday</h1>
        <div class="timetable-lesson"></div>
        <div class="timetable-lesson"></div>
        <div class="timetable-lesson"></div>
        <div class="timetable-lesson"></div>
      </div>
      <div class="timetable-day">
        <h1 class="day">wednesday</h1>
        <div class="timetable-lesson"></div>
        <div class="timetable-lesson"></div>
        <div class="timetable-lesson"></div>
      </div>
      <div class="timetable-day">
        <h1 class="day">thursday</h1>
        <div class="timetable-lesson"></div>
        <div class="timetable-lesson"></div>
        <div class="timetable-lesson"></div>
      </div>
      <div class="timetable-day">
        <h1 class="day">wednesday</h1>
        <div class="timetable-lesson"></div>
        <div class="timetable-lesson"></div>
        <div class="timetable-lesson"></div>
      </div>
      <div class="timetable-day">
        <h1 class="day">thursday</h1>
        <div class="timetable-lesson"></div>
        <div class="timetable-lesson"></div>
        <div class="timetable-lesson"></div>
      </div>
  </div>
</div>

​

Answer 1

如果将overflow设置为滚动，它将同时适用于两个轴。

Answer 2

如果你像我的例子一样改变你的代码，它对两个轴都有效。

​

.timetable-container {
  position: absolute;
  margin-top: 30px;
  width: 1000px;
  height: calc(100vh - 120px - 30px);
  background: red;
  overflow: auto;
}

​