当前位置: 首页 > 知识库问答 >
问题:

如何在物料界面中居中放置按钮?

荀正谊
2023-03-14

下面给出的是我使用材料ui编码的代码。我对那个地区还是新手。我需要把我的按钮放在中间。但它到了拐角处。我的代码有问题吗?

                <Button className={clsx(classes.button)} 
                type="submit"
                alignItems="center"
                variant="contained">
                 {'Sign Up'}
                </Button>
                </div>```



button:{
    background: 'linear-gradient(45deg, #FE6B8B 30%, #FF8E53 90%)',
    borderRadius: 8,
    border: 0,
    color: 'white',
    height: 48,
    width: "30%",
    padding: '10px 30px',
    boxShadow: '0 3px 5px 2px rgba(255, 105, 135, .3)',
    justifyContent: 'center'
  }

alignItems="center" does not work for me.

共有1个答案

黎震博
2023-03-14

论文:{

textAlign: 'center',
color: theme.palette.text.secondary,

},

我启用了textAlign:“居中”并将其修复

 类似资料:
  • 我有一个登录页面,有两个文本字段:用户名、密码和登录按钮,用户名字段在最上面,密码字段在下面,登录按钮在底部。我希望它们始终位于页面的中心,无论是垂直还是水平。我试过这个: 它只是水平居中。我怎样才能使它水平和垂直居中?

  • 我想绘制以按钮为中心的缩放SVGPath节点。按钮应该保持其大小与图像大小无关,SVGPaths应该保留它们的相对位置。 问题是按钮图像被移位了。

  • 问题内容: 我有这样的标记: div高于img: 我需要将图像放置在div的中间(在其上下具有相同的空白)。 我试过了,它不起作用: 问题答案: 如果您的图像纯粹是装饰性的,那么将其用作背景图像可能是一种更语义化的解决方案。然后您可以指定背景的位置 如果它不是装饰性的并且构成有价值的信息,则img标签是合理的。在这种情况下,您需要使用以下属性设置包含div的样式:

  • 问题内容: 我有一个宽度为100%的div。 我想将按钮居中放置,该怎么办? 问题答案: 更新的答案 由于我注意到这是一个积极的答案,所以进行了更新,但是Flexbox现在是正确的方法。 现场演示 垂直和水平对齐。 只是水平的(只要主伸缩轴是水平的,这是默认值) 使用固定宽度且没有flexbox的原始答案 如果原始海报想要垂直和居中对齐,则对于固定按钮的宽度和高度非常容易,请尝试以下操作 CSS

  • 问题内容: 我已经将图像内的边框设置为none。我现在想将该图像放在其包含div的中心。我曾尝试使用,但没有用。 我敢肯定,我忽略了一些愚蠢的事情,但是我想得到stackoverflow社区的帮助,所以这并不需要我花一个小时盯着屏幕来弄清楚。非常感谢。 这是CSS … 问题答案: 尝试将图片的属性设置为:

  • 我不知道如何在材质UI中居中放置按钮。这是我的代码: 我怎样才能使我的按钮居中?