覆盖材质-ui中的制表符样式（无左/右填充）

Posted 2021-03-27

我需要覆盖填充n个制表符，以便指示符与text：https://i.imgur.com/qJl0jMo.png的长度相同

我正在玩这个例子：https://codesandbox.io/s/o4wp31yo95 ......没有任何运气。我需要从buttonbase中删除左/右填充，但我不知道该怎么做

答案

将以下内容添加到您的样式中：

labelContainer: {
    padding: 0,
},

然后将它添加到你的<Tab>组件。喜欢：

classes={{ root: classes.tabRoot, selected: classes.tabSelected, labelContainer: classes.labelContainer }}

这将使指标与文本的长度相同，但仅适用于长度为72像素的文本，因为minWidth: 72上的tabRoot。为了使其适用于较小的文本，也可以使该值更小。