css - 水平滚动条不显示

问题描述

问 题

这是一个 Demo

在 pre / code 里面
如果代码长度超过代码框的总长，应该会出现一个水平滚动条。但是 demo 里面没有出现。

Demo 里只有选中内容并拖动鼠标，滚动条才会出现。

除此之外，macOS 系统可以使用 shift + 鼠标滚动 进行水平滚动。在 demo 也无法实现。

然后我不知道具体是哪个代码导致了这个原因，所以没办法贴出代码，在 demo 进行调试应该会比较方便。

---

下图为 demo 中的代码块截图。

可知代码长度已超出代码框，但是下面没有出现水平滚动条。
环境为：macOS，Chrome & Firefox

解决方案

没有限制好宽度，把那些父元素都设置为 display：block，宽度就限制住了，滚动条就出现了~

这篇关于css - 水平滚动条不显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！