我正在尝试编写一个电子邮件选择加入框,我已经安装了一个主题并且正在使用 Wordpress。该框在 Firefox 中看起来应该如此,但在 Chrome 中显示不正确,包括文本字段中没有填充,文本字段中的字体颜色不同,2px-ish 填充不应位于蓝色提交按钮的上方和下方。
包括!important
没有效果。
该网站是http://shannonconfairphotography.com,该框位于页面顶部,在 Firefox 中显示效果很好。通常我看不出 Chrome 和 Firefox 之间有什么区别,只有 IE,所以我很难过。
盒子代码是:
<div style="background-color:#efefef; padding:0; margin:0; -webkit-box-sizing:content-box !important; -moz-box-sizing:content-box !important; box-sizing:content-box !important;">
<span style="font-family: 'Rouge Script', cursive; font-size:30px; line-height:16px; color:#8e8e8e; margin-right:15px; padding-left:15px;"> 5 easy ways to save money on your wedding...</span>
<form style="display:inline; margin:0px; padding:0px; height:100%;" action="https://madmimi.com/signups/" method="post" target="_blank">
<input style="display:inline; margin:0px; font-family: 'Rouge Script', cursive; font-size:28px; line-height:22px; height:40px; border:none; color:#acacac; background-color:#fff; width:200px; padding-left:10px; margin-right:5px;" id="signup_first_name" name="signup[first_name]" type="text" placeholder="first name">
<input style="display:inline; margin:0px; font-family: 'Rouge Script', cursive; font-size:28px; line-height:22px; height:40px; border:none; color:#acacac; background-color:#fff; width:200px; padding-left:10px; margin-right:11px;" name="signup[email]" type="text" placeholder="email">
<input style="background-image:none; border: none; background-color:#023972; color:#fff; font-family: 'Rouge Script', cursive; font-size:28px; padding:10px;" value="get it!" type="submit" class="submit">
</form>
</div>