Css 如何对齐两个<；a/>；使用flexbox到中心？

下面是我的html和css代码

.tab{
显示器：flex；
自对准：居中；
对齐项目：居中；
保证金：自动；
宽度：100%；
边框：1px纯红；
}
.章节标题{
显示器：flex；
保证金：5px；
}
.标签{
显示器：flex；
填充：10px；
}
.标签a{
颜色：白色；
背景颜色：绿色；
}
.标签-b{
颜色：白色；
背景颜色：橙色；
}

表a
表b

您需要将内容：中心添加到您的.tab类：

.tab {
   display: flex;
   self-align: center;
   align-items: center;
   margin: auto;
   width: 100%;
   justify-content: center;
   border: 1px solid red;
}

---

为什么不简单地将

文本对齐：居中

.tab{
文本对齐：居中；
宽度：100%；
边框：1px纯红；
}
.章节标题{
保证金：5px；
}
.标签{
填充：10px；
显示：内联块；
}
.标签a{
颜色：白色；
背景颜色：绿色；
}
.标签-b{
颜色：白色；
背景颜色：橙色；
}

表a
表b