html - [HTMl/CSS] 将浏览器缩放到小宽度时，列表项位于导航栏下方

Question

在将浏览器缩放到较小宽度时，我一直试图让它停止在导航栏下方，这就是我的意思(我不能发布图片，因为我没有至少 10 个代表)

但是你可以在这里自己明白我的意思:

http://79.170.40.39/senixmenix.com/index.html

(将浏览器的宽度缩小，你就会明白我的意思了)

我对网络开发还是很陌生，所以还有很多我不明白的地方，希望你能帮助我:-)

亲切的问候，杰斯珀

Answer 1

这是因为“SenixMenix” Logo 位于左侧，当列表项因用户缩小浏览器而用完空间时，它们会移至“SenixMenix” Logo 下方，因为它占用了太多空间。我建议做的是在 637px(即列表项点击 Logo 时)处添加媒体查询，以显示较小的 Logo 。

.bigLogo{
    display: block;
}

.smallLogo{
    display: none;
}

@media (max-width: 637px){
    .bigLogo{
        display: none;
    }

    .smallLogo{
        display: block;
    }
}