css - 将鼠标悬停在导航按钮上时侧边栏移动

Question

我有一个带有按钮的导航栏，当你将鼠标悬停在它们上面时，它们会升起。问题是内容也随之而来。就好像内容不会在其容器中保持静态。我正在使用 z-index，所以很多定位必须是相对的，但玩弄其他定位似乎没有帮助。这一直让我发疯。有什么建议么？

为了隐私或其他原因删除了链接

我直接链接到整个页面以显示完整的问题。对不起，如果有反对的规则；我是新来的。

此外，它还没有完成，代码真的很草率所以，你知道的，不要评判。

Answer 1

首先，导航的 HTML 无效。你有包装列表项的锚标签。由于浮动元素，您还做了很多带有负边距的技巧。最好添加溢出：隐藏；到您的nav ul并实际将这些元素放回视口中。

但是，为了快速解决您的问题，您需要清除您的内容，这样它就不会受到导航中正在进行的定位的影响。见下文。

#content {
    clear: left;
}