两层div，如何使内层div的内容不换行，超出滚动

Feb 6, 2020 | 原创 | 前端 | 阅读 | 123 字 | 1 分钟

今天在遇到了一个问题，需求是两个div平行不换行，宽度超出后实现滚动
参考网上资料，有两种：1、float 2、display: inline-block，然而并不能实现，内容在超出后依然后自动换行

解决办法：

<!-- 最外层 -->
<div style="width: 100%">
  <div stye="white-space: nowrap; width: fit-content">
    <!-- 内容 ↓ -->
    <div style="display: inline-block;">内容</div>
    <!-- 内容 ↑ -->
  </div>
</div>

本文作者：雪花雨
本文链接：https://xuehuayu.cn/2020/02/06/%E4%B8%A4%E5%B1%82div%EF%BC%8C%E5%A6%82%E4%BD%95%E4%BD%BF%E5%86%85%E5%B1%82div%E7%9A%84%E5%86%85%E5%AE%B9%E4%B8%8D%E6%8D%A2%E8%A1%8C%EF%BC%8C%E8%B6%85%E5%87%BA%E6%BB%9A%E5%8A%A8.html
版权声明：① 标为原创的文章为博主原创，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接。② 转载文章来自网络，已标明出处，如有侵权，请联系我。

原创