如何调整嵌入式MailChimp表单的位置

Question

我在我的wordpress站点的页脚中使用RAW HTML小部件在我的主题页面构建器中使用了一个嵌入式MailChimp注册表单。

我设法在同一行上获得了输入字段并在同一行上订阅按钮，这要归功于我在此站点上获得的一些帮助。现在，我只需要删除字段和按钮之间的一些空白空间，然后将所有内容中心。

这是指向我网站的链接，该表格就在底部：

http://origamidotme.staging.wpengine.com

这是我表格的代码：

<!-- Begin MailChimp Signup Form -->
<style type="text/css">
#mc_embed_signup{background:#1b1d1f; clear:left; font:14px Helvetica,Arial,sans-serif; width:100%;}
#mce-EMAIL {display:inline-block; float:left; margin: 6px 20px 0 0;}
/* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
   We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
</style>
<div id="mc_embed_signup">
<form action="https://origami.us11.list-manage.com/subscribe/post?u=c46543dec276193775d525c9f&amp;id=85cb8a5e0e" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div id="mc_embed_signup_scroll">
<input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" size="100%" placeholder="Your Best Email" required>
<!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
<div style="position: absolute; left: -5000px;" aria-hidden="true">.  <input type="text" name="b_c46543dec276193775d525c9f_85cb8a5e0e" tabindex="-1" value=""></div>
<div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="btn border-width-0 btn-accent btn-round btn-flat"></div>
</div>
</form>
</div>
<!--End mc_embed_signup-->

知道我需要添加的内容以使该按钮更靠近场的尽头，然后如何使整个事情集中在我的页脚中？

事先感谢您的帮助。

Answer 1

这样更新代码：

<!-- Begin MailChimp Signup Form -->
<style type="text/css">
  #mc_embed_signup {
    background: #1b1d1f;
    clear: left;
    font: 14px Helvetica, Arial, sans-serif;
    width: 100%;
  }
  #mce-EMAIL {
    display: inline-block;
    padding: 12px;
  }
  /* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
   We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
</style>
<div id="mc_embed_signup">
  <form action="https://origami.us11.list-manage.com/subscribe/post?u=c46543dec276193775d525c9f&amp;id=85cb8a5e0e" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
    <div id="mc_embed_signup_scroll">
      <input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" size="100%" placeholder="Your Best Email" required>
      <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="btn border-width-0 btn-accent btn-round btn-flat">
      <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
      <div style="position: absolute; left: -5000px;" aria-hidden="true">. <input type="text" name="b_c46543dec276193775d525c9f_85cb8a5e0e" tabindex="-1" value=""></div>
    </div>
  </form>
</div>
<!--End mc_embed_signup-->