css - Material-ui 标签左对齐问题

Question

material-ui 的当前版本不支持组件中的左对齐选项卡。我看到了一个解决方法 https://github.com/callemall/material-ui/issues/4420

这是我的实现 https://www.webpackbin.com/bins/-KpxVgwKOLPfM8CFcu5-

但是，当选择第一个选项卡时，选项卡栏会变形并且高度超出预期。

Answer 1

左对齐

An initial migration of the Tabs component has been merged on the next branch.That feature was implemented and is now the default behavior.Thanks for providing those details.

这是受支持的 feature在 v1-beta

修复高度问题

The Tab Bar is distorted and has more height than desired.

headline: {{ marginTop: '0px' }}

参见:comment

使用填充

I want to have a container margin after the tabs end.

标签结构对我来说真的很奇怪，
由于某些原因你不能使用边距，尝试使用填充:

contentContainerStyle={{ paddingTop:'50px' }}

设置宽度

不要在 tabItemContainerStyle 中设置宽度，而是使用包装器:

<div calssName='wrapper' style={{ width: '500px' }} /> 
    <Tabs {...}/>
</div>

Example (webpackbin)