如何正确地将自定义 css 应用于材质 ui 按钮？答案

【问题标题】：How do I correctly apply custom css to material ui button?如何正确地将自定义 css 应用于材质 ui 按钮？
【发布时间】：2021-01-29 05:08:09
【问题描述】：

我在尝试自定义样式选择的材料 UI 按钮时遇到问题，同时尝试将按钮的左侧文本部分向左对齐，同时保持右侧文本居中。

我正在使用 css 模块和 makeStyles。

justifyContent: "center" 适用于右侧 div (classes.activityButton)。

justifyContent: "flex-start" 不适用于左侧 (classes.leftSide)。

您还可以看到按钮的 “SEDENTARY” 部分与 “LIGHTLY ACTIVE” 的对齐方式不同，即使它们具有相同的命令？

【问题讨论】：

【解决方案1】：

问题在于您的 html 结构，justify-content 仅将元素的子元素水平对齐到您应用它的元素上。它不会对齐元素本身。

您需要：

【讨论】：