reactjs - 如何添加偏移 Material -ui Grid

Question

我正在尝试使用它的网格系统在 material-ui 上制作一个小的“添加项目”弹出对话框。但我不知道如何向网格添加偏移量。我正在尝试实现类似于 Bootstrap 的 col-sm-10 offset-1使用<Grid container justify='center' alignItems='center' item xs={10}>但它不起作用。我的解决方案是在我的内容前后添加一个空列，例如:

<Grid item xs={1}></Grid>
<Grid item xs={10} justify='center' alignItems='center'>Content</Grid>
<Grid item xs={1}></Grid>

我必须这样做吗？我不明白为什么 justify 和 alignItems 不起作用。
这是codeandbox上的代码:
https://codesandbox.io/s/item-added-jx9ri
谢谢您的帮助!

Answer 1

我 fork 了沙箱，您需要向容器添加一些属性，而不是使用幽灵网格项目。
请看这里https://codesandbox.io/s/item-added-forked-kv9qw?file=/src/App.js