我试图将一个输入按钮置于一个表单中但通常的边距:0 auto; 没有做任何事情.以下是我的HTML设置方式:
<body>
<div class="container">
<div class="contact-div">
<form id="contact-form">
<div class="input-field">
<input type="button" value="Submit" class="submit-button" />
</div>
</form>
</div>
</div>
</body>
和CSS:
body {
padding:0;
margin:0;
width:100%;
font-family: Century Gothic,sans-serif;
}
.container {
width:100%;
}
#contact-div {
height:100vh;
width:100%;
background: url("images/contactpic3.jpg") no-repeat center fixed;
background-size: cover;
}
.input-field{
width:60%;
margin:0 auto;
}
.submit-button {
height:40px;
width:200px;
margin:auto;
border:2px black solid;
border-radius:10px;
font-size:1.5em;
text-align:center;
}
这里也是一个有问题的JSFiddle(https://jsfiddle.net/wge66p83/).正如您在我添加的红色背景颜色中所看到的那样,提交按钮不是居中的,只是粘贴在左边缘input-field.如何将此输入放在我的div中心？