Foundation for Apps项目中的合理选项卡

Question

我正在寻找一种在我的Foundation应用中实现容器中全宽度/对齐标签的方法。这就是目前正在发生的事情。

在Twitter Bootstrap中，我可以do this，我正在寻找基金会中相同类型的功能。这本身可能吗？

我现在只使用default tabs structure example。

Answer 1

Foundation中的选项卡使用flexbox模型。默认情况下，他们的flex-grow为0（他们不会增长以填充父级）。将其更改为1，他们会。或者，您可能希望添加text-align: center，因为现在标签文本将小于标签本身：

div.tabs .tab-item {
    flex-grow: 1;
    text-align: center;
}