所以,我试图创建一个水平列表,用于我正在设计的新网站。我已经尝试了一些已经在网上找到的建议,例如将“浮动”设置为左侧等等 - 但在解决问题时这些都没有奏效。
ul#menuItems {
background: none;
height: 50px;
width: 100px;
margin: 0;
padding: 0;
}
ul#menuItems li {
display: inline;
list-style: none;
margin-left: auto;
margin-right: auto;
top: 0px;
height: 50px;
}
ul#menuItems li a {
font-family: Arial, Helvetica, sans-serif;
text-decoration: none;
font-weight: bolder;
color: #000;
height: 50px;
width: auto;
display: block;
text-align: center;
line-height: 50px;
}
<ul id="menuItems">
<li>
<a href="index.php">Home</a>
</li>
<li>
<a href="index.php">DJ Profiles</a>
</li>
</ul>
目前我不确定是什么导致了这个问题,我将如何着手解决它?
原文由 Christopher Orchard 发布,翻译遵循 CC BY-SA 4.0 许可协议
更新的答案
我注意到很多人都在使用这个答案,所以我决定稍微更新一下。不再包括对现在不受支持的浏览器的支持。