html - 试图在我的页面的中心对齐 html 按钮

标签 html css button alignment vertical-alignment

<分区>

无论使用何种浏览器,我都试图将 HTML 按钮准确地对齐到页面的中心。它要么向左浮动,同时仍处于垂直中心,要么位于页面上的某个位置,例如页面顶部等。

我希望它在垂直和水平方向上都居中。这是我现在写的:

<button type="button" style="background-color:yellow;margin-left:auto;margin-right:auto;display:block;margin-top:22%;margin-bottom:0%">
   mybuttonname
</button> 

最佳答案

这是您的解决方案:JsFiddle

基本上,将您的按钮放入文本居中的 div 中:

<div class="wrapper">
    <button class="button">Button</button>
</div>

具有以下样式:

.wrapper {
    text-align: center;
}

.button {
    position: absolute;
    top: 50%;
}

给猫剥皮的方法有很多种,这只是其中一种。

关于html - 试图在我的页面的中心对齐 html 按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11799159/

相关文章:

jquery .each(function(index, element)) 不工作?

angular - 单击按钮并通过 component - angular 增加数字

javascript - 在网页上包含不引人注目的信息的最佳方式

CSS。如果覆盖页脚,如何将固定位置的div向上移动

css border-image渐变解决方案

javascript - 具有可变高度的粘性标题

javascript - 新窗口中的链接是可选的

HTML/CSS 按钮问题

html - 如何使用 Perl 删除所有只有空格的字体标签?

javascript - 将python的json对象转换为html表?