CSSコードを中央と中央に配置する

Question

私は、このボタンをページの正確な中央に（縦と横に）作成する方法を理解しようとしています。私はそれを水平面上に集中させましたが、垂直面上には配置しませんでした。どんな助けもありがとう！

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; 
} 

Answer 1

位置を絶対または固定に変更します。

Answer 2

入力

テキストアライメント：center; パディング：50px 0;

Answer 3

私はそれはあなたが必要なものですかどうかわからないんだけど、このJSFiddle exampleを見てみましょう。

私が使用したCSSは次のとおりです。

input#gobutton{ 
    position: relative; 
    display: block; 
    margin: auto; 
    top: 40%; 
    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; 
}