html - 包装器中 div 的 overflow-x

Question

网站的大致结构如下:

<div class="wrapper">
    <div class="content">
          <div class="report">
          </div>
    </div>
</div>

现在我有下一个 CSS:

.wrapper {
     width: 75%;
     margin: 0 auto;
}

那么问题来了，如何防止带有report类的div溢出带有wrapper类的div呢？在溢出的情况下，我想将滚动添加到带有报告类的 div。

现在“报告”div 只是动态地扩展包装器的宽度。

提前致谢!

Answer 1

使用 overflow: auto; 仅在需要滚动的时候和位置添加滚动条。如果视口(viewport)足够大，则不会出现滚动条。如果视口(viewport)不够宽但足够高，它将只在 y 轴上创建一个滚动条。

参见 this Mozilla Developer Network page在 overflow 上获取更多信息。