如何在版本 "@mui/material" 中将工具栏上的项目居中："^5.11.3"

Question

我有这个例子从他们的网站
https://codesandbox.io/s/0f50jf?file=/demo.js

我正在尝试将所有工具栏元素居中使用:

sx= {{
justifyContent: 'center',
alignItems: 'center'}}

但是什么都不能用

我怎么做

justifyContent

我看到了这个解决方案React material-ui:居中项目在工具栏
，但它不是不工作

Answer 1

在flex box中，有一个技巧可以帮助在flex box中居中元素，margin-left: auto和margin-right: auto，我已经将这个CSS应用到搜索栏中，这使得搜索在中心

创建一个CodeSandbox Demo

相关资源

Flex box和Margin的CSS技巧文章

关于flexbox和margin: Link

如果您有疑问请告诉我，我很乐意帮助您

Answer 2

你试过了吗