PrismJS行号在可展开Div中显示异常，缩放后恢复正常

• 可展开div初始隐藏导致宽度计算错误：PrismJS Line Numbers插件初始化时，会依据代码块的当前可视宽度来计算行号容器的宽度。如果代码块嵌套在默认隐藏的可展开div（比如设置了display: none）中，插件无法获取代码块的真实宽度，行号容器的宽度值被错误计算，最终引发行号换行堆叠。
• 窗口缩放触发重排修正宽度：缩放浏览器窗口时，浏览器会触发页面重排（reflow），这个过程中会重新计算元素的尺寸，行号容器的宽度被自动修正，所以显示恢复正常。
• 外部代码块无隐藏限制：放在可展开div外的代码块在页面加载时处于可视状态，插件能正确获取其宽度，行号容器的宽度计算准确，因此显示正常。

• 若可展开div初始用display: none隐藏，可替换为height: 0; overflow: hidden; visibility: hidden;这类不影响元素尺寸计算的隐藏方式，再测试行号显示是否正常。
• 也可以在可展开div被展开后，手动调用Prism.highlightAll()或Prism.plugins.lineNumbers.resize(element)来重新计算行号容器宽度，解决显示问题。

内容的提问来源于stack exchange，提问作者Techie001