css - DIV 没有环绕它的子元素？

Question

所以这是我的代码：

#headerMenu_outer #headerMenu_inner
{
    background-color:#333333;
}
#headerMenu_outer #headerMenu_inner li
{
    padding-left:15px;
    padding-right:15px; 
    text-align:center;
    font-size:13px;
    font-weight:bold;
    display:inline;
    color:#00FF33;
    background-color:#00CCCC;
    cursor:pointer;
}

我希望 headerMenu_inner 位于 headerMenu_outer 的中心。通常，“margin-left：auto”和“margin-right：auto”有效。但是，headerMenu_inner 占据了 headerMenu_outer 的整个宽度。反正有没有让它不这样做？我希望它像李需要的那样宽。

谢谢

Answer 1

#headerMenu_inner很可能是块级元素，因此会占用尽可能多的水平空间。为该元素分配一个宽度，然后执行您的边距技巧，例如margin: 0 auto将其居中。

如果您希望它与 LI 一样宽，（在我的脑海中）将 LI 元素设置为不换行，然后将“内部”元素设置为display: inline-block.