Z-index搞乱了导航栏的CSS。

要解决Z-index导致导航栏混乱的问题，可以尝试以下解决方案：

1. 使用position属性：将导航栏的父元素设置为相对定位（position: relative），并将导航栏设置为绝对定位（position: absolute）。然后，通过设置合适的z-index值来控制导航栏的显示顺序。

.navbar-parent {
  position: relative;
}

.navbar {
  position: absolute;
  z-index: 100;
}

2. 调整HTML结构：将导航栏的HTML代码放置在其他元素之前，确保导航栏处于HTML结构的顶部。然后，通过设置z-index来控制导航栏的显示顺序。

<div class="navbar"></div>
<div class="content"></div>

.navbar {
  z-index: 100;
}

3. 修改z-index值：检查导航栏及其相关元素的z-index值，确保它们的层级顺序正确。如果导航栏的z-index值较小，则增加它的值，确保它位于其他元素的上方。

.navbar {
  z-index: 100;
}

.other-element {
  z-index: 50;
}

通过以上方法，可以解决Z-index搞乱导航栏的问题。根据具体情况选择适合的方法来修复CSS。