我有一个包含一些文本和图像的容器，以及一个应该（当时机成熟时）从右侧滑入的 导航 div。
为了实现这一点，我想将 div 推到屏幕右侧并将overflow-x: hidden 放在它的容器上以隐藏它，然后在出现时将其推回屏幕它是必需的。
问题是，当我在容器上设置overflow-x: hidden时，它也会剪掉导航的垂直内容。
Here's a fiddle with a demo。
我尝试过的：
overflow-y 设置不同的值
这些似乎都不起作用。
我查看了其他具有类似问题的问题，但没有一个能解决我的问题 - 他们提出了不适合我的情况的替代解决方案。
谢谢！
【问题讨论】：
标签： html css navigation overflow
这是来自 CSS 中的 .img 类，其中有 height: 200px;。您正在加载的图像实际上是 310 像素高，因此您会发现底部三分之一（大约）被剪掉了。
【讨论】：
.nav 具有position: absolute 时，您将其从文档流中取出（本质上是说“在页面上绘制所有内容，然后 放置这个element")，这意味着它不能用于确定高度。浏览器唯一需要确定高度的是图像，它是 200 像素高，加上它上面的文本，因此它将元素剪辑到该大小。
.nav 放在我想要的任何高度，而不管它的容器高度如何。然而这并没有发生。
.nav 仍然是你想要的高，但是因为它仍然是 ~200px-tall 容器的子容器，它仍然会被剪裁。您要么需要将其移出容器，要么放大容器的高度以显示整个.nav。
html 和body 设置为overflow-x: hidden，否则将无法正常工作。感谢所有的帮助！您可能应该更新您的答案以帮助其他人。