jquery - div 中的居中表单和样式表单

Question

尝试做一些事情遇到了障碍。试图将表单置于要求电子邮件的位置，并且有“让我们谈谈”按钮。它应该位于标题“让我们取得联系”的正下方居中

我也想给它一个阴影，但是我有的东西不起作用。

最后应该是这样的

这是我的代码的 fiddle :https://jsfiddle.net/vcx4vm39/

这是影响表单的所有 css。

form{
 display: table;
margin: 0 auto;
}

#forth{
width: 100%

}

input[type=text], select {
width: 400px;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
/*     border: 1px solid #ccc; */
border-radius: 30px;
box-sizing: border-box;
font-family: proxima nova;

font-size: 14px;

position: absolute;

-webkit-box-shadow: 0px 0px 20px black rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 0px 20px black rgba(0, 0, 0, 0.5);
box-shadow: 0px 0px 20px black rgba(0, 0, 0, 0.5);


}

input[type=submit] {
width: 160px;
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
border-radius: 30px;
cursor: pointer;
background-color: #0B315C;
font-family: proxima nova;
font-size: 14px;
font-weight: bold;
position: absolute;
margin: -10px 0px 0px 240px;

}

Answer 1

查看更新后的 fiddle :https://jsfiddle.net/vcx4vm39/2/

在表单中添加类 .email-form 并添加以下 CSS:

.email-form {
    width: 400px;
}

.email-form input {
    border: 0;
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2);
}