Html CSS：将固定菜单居中，没有特定宽度_Html_Css_Menu

Html CSS：将固定菜单居中，没有特定宽度

html css menu

Html CSS：将固定菜单居中，没有特定宽度,html,css,menu,Html,Css,Menu,我一直在努力：集中我的CSS菜单！！我不知道怎么做。我做错了什么可能是因为您使用了float:left可能是因为您使用了float:left试试这个 .menu { height: 80px; border: 1px solid rgba(255,255,255,0.3); position: fixed; top: -8px; left: 50%; margin-left: -200px; /* half of the .menu width

我一直在努力：集中我的CSS菜单！！我不知道怎么做。我做错了什么

可能是因为您使用了

float:left

可能是因为您使用了

float:left

试试这个

.menu {
    height: 80px;
    border: 1px solid rgba(255,255,255,0.3);
    position: fixed;
    top: -8px;
    left: 50%;
    margin-left: -200px; /* half of the .menu width if you don't know width delete this line */
}

如果不知道这个元素的宽度，可以使用javascript/jquery动态计算

$(document).ready(function() {
    var wdth = $('.menu').width();
    wdth = wdth/2;
    $('.menu').css('margin-left', -wdth);
});

下面是工作示例

试试这个

.menu {
    height: 80px;
    border: 1px solid rgba(255,255,255,0.3);
    position: fixed;
    top: -8px;
    left: 50%;
    margin-left: -200px; /* half of the .menu width if you don't know width delete this line */
}

如果不知道这个元素的宽度，可以使用javascript/jquery动态计算

$(document).ready(function() {
    var wdth = $('.menu').width();
    wdth = wdth/2;
    $('.menu').css('margin-left', -wdth);
});

以下是您使用的“位置固定”的工作示例。因此，“边距自动”不适用于固定位置。您可以执行以下操作：

拆下固定定位螺栓。在div中换行并指定宽度100%

为您设置宽度

ul

。如果希望

ul

随着

li

的增加而增加，可以将

ul

宽度设置为继承

如果你仍然做不到，请发表评论，我会为你上传代码。但我相信你自己能做到

你用的是固定位置。因此，“边距自动”不适用于固定位置。您可以执行以下操作：