FlexBox（display: flex;）を使って、横並びのメニューを作る方法です。
index.html
<ulclass="nav"><li><ahref="#">Menu1</a></li><li><ahref="#">Menu2</a></li><li><ahref="#">Menu3</a></li></ul>style.css
.nav{list-style:none;display:flex;}.navli{width:160px;height:48px;line-height:48px;text-align:center;background-color:#333;}.navlia{text-decoration:none;color:#fff;font-weight:bold;}- list-style: none; 黒丸を消します。
- display: flex; ボタンを横並びにします。
- line-height: 48px; テキストをボタンの上下中央に配置します。（heightと同じ値にします）
- text-align: center; テキストをボタンの左右中央に配置します。
- text-decoration: none; リンクの下線を消します。