Question

我已经创建了一个滑块图像滚动条和一个在滚动时应该滑过的菜单栏/并且在调整窗口大小时应该适应。

当我调整大小时，我的滑块和菜单栏之间会出现白色“间隙”。我确定我忽略了一些愚蠢的事情。

这是导航栏的主要CSS

#Topnav {

    cursor: default;
    background-color: #dcd9d6;
    padding: 0;
    text-align: center;
    width: 100%;
    margin: auto;
    overflow: hidden;
    z-index: 150;
    box-shadow: 0 0 2px 3px #383433;
    font-family: 'Roboto', sans-serif;
}

这是滑块图像的主要css

.slideshow-container {
    max-width: 100%;
    position: fixed;
    margin: auto;
    margin-bottom: 0px;
}

但是，我在我的文件中运行了很多css，同时尝试（试错）以使其获得响应。我把它的很大一部分都包含在这个小提琴中，因为我怀疑在搞乱的时候傻傻地溜进来。

此外，在渲染窗口中可以清楚地看到白色“间隙”。

链接到小提琴：

https://jsfiddle.net/abLtxg9h/1/

调整大小时，菜单栏应始终跟随滑块图像的底部。关于我做错了什么的建议？

谢谢！

Answer 1

将导航栏移动到与滑块（标题）相同的父div中。然后：

.nav{
  position:fixed;
  bottom:0;
}

标题图像（滑块）和菜单栏

1 个答案: