带 Bootstrap 的 CSS 表单无法居中和调整按钮大小

Question

我想将电子邮件输入(使用 mailchimp)和转到按钮居中并在其上有更好的视觉效果，至少将输入电子邮件字段的宽度增加到至少 200 像素宽度或网格的 80%但我真的不知道如何改变它，我到处都试过了。

我的 html 代码:

<div class="container-fluid">
    <div class="container">
        <div class="row">
            <div class="col-lg-4">
            </div>
        <div class="col-lg-4">
            <div class="subscribe">
                <!-- Begin MailChimp Signup Form -->
                <div id="mc_embed_signup">
                    <div id="mc_embed_signup_scroll">
                        <div class="indicates-required">Subscribe to know more!
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div id="mc_embed_signupform">
        <div class="container-fluid">
            <div class="container">
                <form class="form-inline" action="http://nibook.us14.list-manage.com/subscribe/post?" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" target="_blank" novalidate>
                    <div class="form-group formwidth">
                        <input type="email" value="" placeholder="Enter your email" name="EMAIL" class="requiredemail" id="mce-EMAIL">
                     </div>
                  <input type="submit" value="Go" name="subscribe" id="mc-embedded-subscribe" class="button">
                </form> 
            </div>
        </div>
     </div>
     <div class="col-lg-4">
     </div>
  </div>

我的表单 CSS

/* MailChimp Form Embed Code - Classic - 12/17/2015 v10.7 */
#mc_embed_signup{background:#EEF1F8; font:14px Helvetica,Arial,sans-serif; max-width:100%;display:block;margin:auto;text-align:center;}
#mc_embed_signupform{background:#EEF1F8; font:14px Helvetica,Arial,sans-serif; width:60%;display:block;margin:auto;padding-left:50px;padding-bottom:50px;}
#mc_embed_signup form {display:block; position:relative; text-align:left;  padding:10px 0 10px 3%; width:80%}

.button {font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; font-size: 14px; background-color: #0670EB; border:solid; border-width:thin; border-color:#0670EB;border-radius:4px; transition: all 0.23s ease-in-out 0s; color: #FFFFFF; cursor: pointer; font-weight: bold; height: 40px; line-height: 32px; padding-left:10px; text-align: center; text-decoration: none; width: 100px;margin-left:20px;}
.button:hover {font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; font-size: 14px; background-color: #FFFFFF; border: 1 none; border-color:#0670EB;border-radius:4px; transition: all 0.23s ease-in-out 0s; color: #0670EB; cursor: pointer; font-weight: bold; height: 40px; line-height: 32px; padding-left:10px; text-align: center; text-decoration: none; width: 100px;margin-left:20px;}
#mc_embed_signup .small-meta {font-size: 11px;}
#mc_embed_signup .nowrap {white-space:nowrap;}

#mc_embed_signup .indicates-required {font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; color:#4C535D; text-align:left; font-size:25px; margin-right:4%;padding-top:20px;padding-bottom:20px;float:left}

.requiredemail {font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; color:#333333;  font-size:12px; height:40px;padding:10px;margin-left:auto; margin-right:auto;max-width:80%;}

#mc_embed_signup .mc-field-group.input-group ul {margin:0; padding:5px 0; list-style:none;}
#mc_embed_signup .mc-field-group.input-group ul li {display:block; padding:3px 0; margin:0;}
#mc_embed_signup .mc-field-group.input-group label {display:inline;}
#mc_embed_signup .mc-field-group.input-group input {display:inline; width:auto; border:none;}

#mc_embed_signup div#mce-responses {float:left; top:-1.4em; padding:0em .5em 0em .5em; overflow:hidden; width:90%; margin: 0 5%; clear: both;}
#mc_embed_signup div.response {margin:1em 0; padding:1em .5em .5em 0; font-weight:bold; float:left; top:-1.5em; z-index:1; width:80%;}
#mc_embed_signup #mce-error-response {display:none;}
#mc_embed_signup #mce-success-response {color:#529214; display:none;}
#mc_embed_signup label.error {display:block; float:none; width:auto; margin-left:1.05em; text-align:left; padding:.5em 0;}

#mc-embedded-subscribe {}
#mc_embed_signup #num-subscribers {font-size:1.1em;}
#mc_embed_signup #num-subscribers span {padding:.5em; border:1px solid #ccc; margin-right:.5em; font-weight:bold;}

#mc_embed_signup #mc-embedded-subscribe-form div.mce_inline_error {display:inline-block; margin:2px 0 1em 0; padding:5px 10px; background-color:rgba(255,255,255,0.85); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-size:14px; font-weight:normal; z-index:1; color:#e85c41}
#mc_embed_signup #mc-embedded-subscribe-form input.mce_inline_error {display: inline-block;border:2px solid #e85c41;}

Answer 1

1)    div is missing 
2)   remove container class
 3)
     <div class="form-Ccontainer">
     <div class="form-group formwidth">
                                <input type="email" value="" placeholder="Enter your email" name="EMAIL" class="requiredemail" id="mce-EMAIL">
                            </div> 

<input type="submit" value="Go" name="subscribe" id="mc-embedded-subscribe" class="button">


 </div>

 4)         <style>
       .form-Ccontainer{width:100%;max-width:400px;margin:auto;}
        .requiredemail{max-width:100%}
       </style>