无法让我的导航栏变小答案

【问题标题】：Can't make my nav bar smaller无法让我的导航栏变小
【发布时间】：2014-03-20 12:51:58
【问题描述】：

我正在制作我的导航栏，但我似乎无法让它变得更小，现在它看起来对我想要的来说太厚了，我已经尝试改变填充、边距等但不能似乎让它让步。改变高度会使它变薄，但链接不会随 div 移动，也不会垂直居中。这可能是一个简单的疏忽，但我没有看到它，希望能得到帮助！

HTML：

<nav>
        <ul>
            <li><a href="index.html">Home</a></li>
            <li><a href="gallery.html">Gallery</a></li>
        </ul>
    </nav>

CSS：

body     {
background-color:#000;
color:#fff;
}


p       {
text-align:center;
}

img     {
display:block;
margin-left:auto;
margin-right:auto;
padding:10px;
}

nav     {
background-color:#808080;
display:inline-block;
text-align:center;
padding:0;
width:1000px;
list-style:none;
}


nav ul li        {
display:inline-block;
}

【问题讨论】：

添加nav ul { margin: 0; }

标签： html css resize navbar thickness

【解决方案1】：

将此添加到您的 CSS：

ul{
 margin:0;
}

附言。仅当您想减少菜单栏的厚度（如您在问题中提到的）时，这才有用。如果您想要更多格式的导航，则必须在其中添加更多内容。

【讨论】：

【解决方案2】：

您应该为ul 和li 使用浮动、边距和填充。赫拉是example

nav ul li {
    float:left;
    margin-right:10px;
    list-style:none;
}

【讨论】：