Html 如何将一组列表元素放在中间，并将它们并排放置？

这是我的代码，我正在做一个注册页面

<div class="form">
  <ul class="tab-group">
    <li class="tabsignup"><a href="/signup.html">Sign Up</a></li>
    <li class="tablogin"><a href="/login.html">Log In</a></li>
  </ul>
</div>

在这段代码中，我希望列表居中，但也彼此相邻，请帮我解决这个问题

ul{
显示器：flex；
列表样式类型：无；
证明内容：中心；
对齐项目：居中；
边框：纯色1px蓝色；
高度：50vh；
}
李{
利润率：0.4vw；
}

请分享您的风格，您是否尝试过使用flexbox？谢谢，效果非常好！谢谢你的帮助！如果这个答案对你们有用，请接受，谢谢。我刚刚接受了