html - 如何使选项卡按钮宽度灵活 - ionic 2

Question

有什么方法可以使标签按钮的宽度灵活吗？

例如这是我的普通标签

我想使标签的宽度像这张图片一样

我可以通过这个CSS代码显示全文

.tab-button {
   min-width: fit-content;
}

但是结果是这样的图片

Answer 1

也许尝试这样的事情:

.tabs{
  border: 1px solid black;
  width: 300px;
  display: flex;
  justify-content: space-between;
}

.single-tab{
  padding: 10px 20px;
  border: 1px solid gray;
  flex-grow: 1;
}

<div class="tabs">
  <div class="single-tab">
    Tab1
  </div>
  <div class="single-tab">
    Tab2222222
  </div>
  <div class="single-tab">
    Tab3
  </div>
</div>