如何在div中将按钮居中?

我有一个宽度为100%的div。

我想将按钮居中放置,该怎么办?

<div style="width:100%; height:100%; border: 1px solid">

<button type="button">hello</button>

</div>

回答:

由于我注意到这是一个积极的答案,所以进行了更新,但是Flexbox现在是正确的方法。

垂直和水平对齐。

#wrapper {

display: flex;

align-items: center;

justify-content: center;

}

只是水平的(只要主伸缩轴是水平的,这是默认值)

#wrapper {

display: flex;

justify-content: center;

}

如果原始海报想要垂直和居中对齐,则对于固定按钮的宽度和高度非常容易,请尝试以下操作

button{

height:20px;

width:100px;

margin: -20px -50px;

position:relative;

top:50%;

left:50%;

}

仅用于水平对齐

button{

margin: 0 auto;

}

要么

div{

text-align:center;

}

以上是 如何在div中将按钮居中? 的全部内容, 来源链接: utcz.com/qa/410844.html

回到顶部