所以我一直试图在我的网站上实现一个Mailchimp表单，这样人们就可以订阅电子邮件时事通讯。我正在使用Wordpress，并试图通过页脚中的自定义HTML小部件来实现这一点。

宽度：100%；对我不起作用，但它会让我使用它与一个像素值。当然，我希望能够使用100%的宽度，而不必使用像素值。我能够使用%值的唯一方法是当我添加位置：绝对；但是按钮只移动到我使用的宽度的60%左右。我真的卡住了，只想要电子邮件输入和订阅按钮在100%的宽度。有人对我有什么建议吗？我觉得这是一个简单的修复，但到目前为止我已经花了几个小时。

如下所示:

以下是当前代码:

<!-- Begin Mailchimp Signup Form -->
<link href="//cdn-images.mailchimp.com/embedcode/slim-10_7.css" rel="stylesheet" type="text/css">
<style type="text/css">
    #mc_embed_signup{ width:80%; 
position:absolute; 
clear:left;  
font:14px Helvetica,Arial,sans-serif; }

#mc-embedded-subscribe {
    width:100%; 
position:absolute; 
background-color: #94a6bf !important; }

    /* 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="KEEPING THIS PRIVATE" 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" placeholder="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_bb6e0bb53d927bf2a775cf919_9a92e414ab" tabindex="-1" value=""></div>
    <div class="clear"><input type="submit" value="SUBSCRIBE" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
    </div>
</form>
</div>

<!--End mc_embed_signup-->

顺晟科技：

在按钮上使用样式属性(style=“width：100%；”)

<!-- Begin Mailchimp Signup Form -->
<link href="//cdn-images.mailchimp.com/embedcode/slim-10_7.css" rel="stylesheet" type="text/css">
<style type="text/css">
    #mc_embed_signup{ width:80%; 
position:absolute; 
clear:left;  
font:14px Helvetica,Arial,sans-serif; }

#mc-embedded-subscribe {
    width:100%; 
position:absolute; 
background-color: #94a6bf !important; }

    /* 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="KEEPING THIS PRIVATE" 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" placeholder="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_bb6e0bb53d927bf2a775cf919_9a92e414ab" tabindex="-1" value=""></div>
    <div class="clear"><input type="submit" value="SUBSCRIBE" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
    </div>
</form>
</div>

<!--End mc_embed_signup-->

父div也定义全宽。这对我管用。试试这个。

<!-- Begin Mailchimp Signup Form -->
<link href="//cdn-images.mailchimp.com/embedcode/slim-10_7.css" rel="stylesheet" type="text/css">
<style type="text/css">
    #mc_embed_signup{ width:80%; 
position:absolute; 
clear:left;  
font:14px Helvetica,Arial,sans-serif; }

#mc-embedded-subscribe {
    width:100%; 
position:absolute; 
background-color: #94a6bf !important; }

    /* 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="KEEPING THIS PRIVATE" 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" placeholder="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_bb6e0bb53d927bf2a775cf919_9a92e414ab" tabindex="-1" value=""></div>
    <div class="clear"><input type="submit" value="SUBSCRIBE" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
    </div>
</form>
</div>

<!--End mc_embed_signup-->