html - 水平和垂直居中按钮的 CSS 代码

标签 html css

我想弄清楚如何让我创建的这个按钮位于页面的正中心(垂直和水平)。我已经让它在水平面上居中,但不是在垂直平面上。任何帮助将不胜感激!

input#gobutton{
position: relative;
top: 50%;
left: 50%;
transform: translate(-50%, -50%)
cursor:pointer; 
padding:5px 25px; 
background:#87CEFA; 
border:1px solid #1E90FF; 
-moz-border-radius: 10px; 
-webkit-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
box-shadow: 0 0 4px rgba(0,0,0, .75);
color:#f3f3f3;
font-size:1.1em;
}

最佳答案

输入

文本对齐:居中; 内边距:50px 0;

http://www.w3schools.com/css/css_align.asp

关于html - 水平和垂直居中按钮的 CSS 代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39600827/

相关文章:

css - 无法将两个图像之间的文本居中

javascript - 使用 jQuery 的 Html 5 嵌套拖放

html - 如何垂直对齐标签?

html - 修复了 div 上的背景图像在 iOS 设备上不起作用的问题? [里面的 JSFiddle]

html - 左 Div 和右 Div 的高度应该相等..!

javascript - 在 bootstrap 中垂直定位 .tooltip-inner

javascript - 设置 xlink :href in svg with angularjs to base64-encoded image

html - html表单中的按钮定位

html - 使整个背景图像可点击

css - 如何为多个 float 拇指提供边距,以便它们从左边框到右边框?