如何在与电子邮件表单相同的行上获取提交按钮答案

【问题标题】：How to get submit button on same line as email form如何在与电子邮件表单相同的行上获取提交按钮
【发布时间】：2016-02-10 19:24:18
【问题描述】：

我正在开发一个 WordPress 网站，无论我将电子邮件注册表单放在哪里，我似乎都无法让按钮与您输入电子邮件的框位于同一行。我忽略的代码有问题吗？

<div id="robly_embed_signup">
  <form action="https://list.robly.com/subscribe/post" method="post" id="robly_embedded_subscribe_form" name="robly_embedded_subscribe_form" class="validate" target="_blank" novalidate="">
    <input type="hidden" name="a" value="821e061e2be0076acb86297c73307f0f" />
                <div class="robly_field_group"><input type="text" name="EMAIL" id="DATA0" class="required" autocapitalize="off" autocorrect="off" value="enter your email address" onfocus="if (this.value=='enter your email address') this.value='';"><input type="submit" name="subscribe" id="robly_embedded_subscribe" class="button" value="Subscribe" />

这是我的网站：http://gleefulthings.com/WPtestblog/

【问题讨论】：

标签： forms email input

【解决方案1】：

减小电子邮件输入字段的宽度。在订阅按钮与它一致之前，我将其降至 84%。

电子邮件输入字段的 ID 也为 DATA0，它出现两次，因为它位于标题和内容上方的绿色区域中，并且每个文档的 ID 应该只出现一次。我建议给他们唯一的 ID*，然后分配一个像“emailField”这样的类并将 CSS 添加到您的样式表中，如下所示：

.emailField{
   width:84%;
}

*由于您还有一些引用 DATA0 ID 的 javascript，因此如果您更改 ID，您也需要更新它。

【讨论】：