Html 如何将内容与中心对齐？

所以我遇到了一个无法解决的问题。我想知道是否有人能帮我把按钮对准中心。我不知道为什么我会有这个问题，我通常不会有。考虑到我做的按钮很奇怪，当你看到代码时就会明白了

#导航栏包装器{
宽度：100%；
高度：75vh；
背景色：#1d；
盒影：0.5vh黑色；
}
.nav btn添加{
垫顶：4vh；
垫底：4vh；
左：4vw；
右：4vw；
}
.btn内联块{
显示：内联块；
文本对齐：居中；
}
.nav btn{
衬垫顶部：2.5vh；
垫底：2.5vh；
左侧填充：2.5vw；
右侧填充：2.5vw；
光标：指针；
背景色：透明；
颜色：白色；
过渡：.5s；
}
.nav btn：悬停{
背景色：透明；
颜色：#00C5CD；
边框颜色：#00C5CD；
}

添加到服务器
不和
命令
向上投票

.center{
文本对齐：居中；
}
.btn内联块{
显示：内联块；
}
不和
命令
向上投票

添加

文本对齐：居中

您的父包装

#导航栏包装

#navbar-wrapper {
  width: 100%;
  height: 75vh;
  background-color: #1d1d1d;
  box-shadow: 0 0.5vh black;
  text-align: center;
}

---

将

文本对齐设置为
中的
中心

#navbar-wrapper {
  width: 100%;
  height: 75vh;
  background-color: #1d1d1d;
  box-shadow: 0 0.5vh black;
  text-align: center;
}


#导航栏包装器{
宽度：100%；
高度：75vh；
背景色：#1d；
盒影：0.5vh黑色；
文本对齐：居中；
}
.nav btn添加{
垫顶：4vh；
垫底：4vh；
左：4vw；
右：4vw；
}
.btn内联块{
显示：内联块；
文本对齐：居中；
}
.nav btn{
衬垫顶部：2.5vh；
垫底：2.5vh；
左侧填充：2.5vw；
右侧填充：2.5vw；
光标：指针；
背景色：透明；
颜色：白色；
过渡：.5s；
}
.nav btn：悬停{
背景色：透明；
颜色：#00C5CD；
边框颜色：#00C5CD；
}

添加到服务器
不和
命令
向上投票
只需添加
文本对齐：居中到div
#导航栏包装器

#navbar-wrapper {
  width: 100%;
  height: 75vh;
  background-color: #1d1d1d;
  box-shadow: 0 0.5vh black;
  text-align: center;
}


#导航栏包装器{
宽度：100%；
高度：75vh；
背景色：#1d；
盒影：0.5vh黑色；
文本对齐：居中；
}
.nav btn添加{
垫顶：4vh；
垫底：4vh；
左：4vw；
右：4vw；
}
.btn内联块{
显示：内联块；
文本对齐：居中；
}
.nav btn{
衬垫顶部：2.5vh；
垫底：2.5vh；
左侧填充：2.5vw；
右侧填充：2.5vw；
光标：指针；
背景色：透明；
颜色：白色；
过渡：.5s；
}
.nav btn：悬停{
背景色：透明；
颜色：#00C5CD；
边框颜色：#00C5CD；
}

添加到服务器
不和
命令
向上投票
在您的代码中，我可以看到第一行有一个大按钮，下一行还有3个按钮……您希望中间有哪些内容？