Question

所以，我很开心，为我的新网站测试了MaterializeCSS。然后我意识到了。

表单的视觉效果一直悬停在导航栏上。很遗憾，这是一个无法解决的问题，可能对此有一个简单而明显的解决方法……！但是我本人实在太盲目了。有人可以帮忙吗？

编辑：我知道我在解释问题时很cr脚，所以我希望某些视觉效果可能会有所帮助。

Answer 1

如果我正确理解了这个问题，这是非常简单的解决方案。您不必删除固定位置，但必须补偿导航栏的高度。固定位置会将元素从流中删除，因此其他元素“看不到”。

因此，基本上，只需在您的Page容器中添加上边距，并为其指定navbar的高度值即可。

.pageContainer {
  margin-top: 64px;
}

请注意，您必须考虑到不同的屏幕尺寸和导航栏的更改。

其他阅读可能会有所帮助。

（固定）元素从常规文档流中删除，并且在页面布局中没有为该元素创建空间。 MDN - CSS/position

编辑（在进一步讨论和澄清之后，我正在更新答案）：原始问题发生在滚动条上。这是因为form（或整个pageContainer）的z-index值高于nav（bar）。我直接在Mozilla Firefox的开发工具中将z-index: 2添加到了nav元素中，它解决了这个问题。