css - 固定元素——文本不会到第二行

Question

参见此处:https://www.invigorlaw.com/practice-areas/securities/宽度为 1100 像素左右。

屏幕右侧的面板看起来不错，直到您向下滚动，然后文本从多行变为一行，您无法看到所有文本。

我能分辨的元素之间的唯一区别是顶部是静态的而底部是固定的。

如有任何关于如何让文本显示在多行上的建议，我们将不胜感激。

Answer 1

只要把这是你的CSS

ul.sidenav-ul { 宽度:237px；

这是快速肮脏的有效修复，发生的事情是当 position: fixed 开始时，元素被从上下文中取出(这就是你有 z-index 的原因)所以你可以想到它在某种程度上是 3D。您的词缀有 width: 100% 和 position: static; 并且因此它永远不会超过视口(viewport)，但是 absolute, fixed, relative 他们可以，文本会拉伸(stretch)整个容器。将整个列表的文本限制为一定宽度将使内部的所有元素坚持该宽度，因此您的文本看起来是一样的。

这是一个很好的学习资源:http://www.barelyfitz.com/screencast/html-training/css/positioning/