我正在使用一个简单的UL作为我的navbar,我试图将其中的1项分开UL并将其放在页面的左侧,并将其他3项保持居中,但是我似乎无法使其正常工作.我已经尝试将它包裹在一个跨度中并浮动它,我已经尝试制作一个新的UL,但这只会导致它们在不同的行上.
我只想让主页按钮与左边对齐,其余按钮要居中.也许我错过了一些明显的东西.
ul {
list-style-type: none;
margin: 10px 0 0 0 ;
padding: 0;
text-align: center;
}
li {
display: inline;
padding: 0 15px;
}
a {
color: black;
text-decoration: none;
font-size: 30px;
}Run Code Online (Sandbox Code Playgroud)
<div class="navbar">
<nav>
<div>
<ul>
<li id="homepage"><a href="#">AG Designs</a></li>
<li id="aboutmebutton"><a href="#">About Me</a></li>
<li id="portfoliobutton"><a href="#">Portfolio</a></li>
<li id="contactbutton"><a href="#">Contact</a></li>
</ul>
</div>
</nav>Run Code Online (Sandbox Code Playgroud)