我试图将订阅表单对齐到精选图片下方。我使用了在codepen.io上找到的订阅表单,我不确定如何定位此表单。我添加了html和css。如果有人能帮助我,我会非常感激。提前致谢。
当前输出:
#mc_embed_signup {
background: none;
font: 14px Helvetica, Arial, sans-serif;
margin: 500px;
padding: 0;
}
.email_capture--wrapper {
max-width: 600px;
display: block;
margin: 5% -70px;
padding: 0 15px;
}
.mailchimp {
width: 100%;
}
.mailchimp input[type="email"] {
background: #f5f5f5;
height: 55px;
padding: 18px 20px;
font-size: 20px;
margin-bottom: 15px;
border: none;
outline: none;
color: #444;
float: left;
-webkit-appearance: none;
-webkit-border-radius: 4px 0px 0px 4px;
-moz-border-radius: 4px 0px 0px 4px;
border-radius: 4px 0px 0px 4px;
-webkit-box-shadow: inset 0 -1px rgba(0, 0, 0, 0.1);
-moz-box-shadow: inset 0 -1px rgba(0, 0, 0, 0.1);
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.1);
}
.mailchimp input[type="submit"] {
font-size: 18px;
height: 55px;
float: left;
-webkit-border-radius: 0px 4px 4px 0px;
-moz-border-radius: 0px 4px 4px 0px;
border-radius: 0px 4px 4px 0px;
}
}
@media (max-width: 767px) {
.mailchimp .form-group > input[type="email"] {
-webkit-border-radius: 4px 4px 4px 4px;
-moz-border-radius: 4px 4px 4px 4px;
border-radius: 4px 4px 4px 4px;
}
.mailchimp .form-group > input[type="submit"] {
width: 100%;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
}

<div class="pull-right">
<!-- Navigation -->
<nav class="navbar navbar-fixed-top pull-right">
<div class="container">
<!-- Begin MailChimp Signup Form -->
<link href="..." rel="stylesheet" type="text/css">
</div>
</nav>
</div>
</div>
<!--end of pull-right -->
<div id="mc_embed_signup">
<form action="..." method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div id="mc_embed_signup_scroll">
<label for="mce-EMAIL"></label>
<input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required>
<!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
<div id="signup">
<input type="text" name="..." tabindex="-1" value="">
</div>
<div>
<input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button">
</div>
</div>
</form>
</div>
&#13;