忍者表单 - 对齐文本区域和提交按钮

Question

我只是使用Ninja Forms Wordpress插件在我的网站上放置了一个简单的电子邮件订阅表单。提交按钮位于文本区域下方。如何使提交按钮与文本区域的右侧对齐？

<div class="email-form-wrap">
<?php if( function_exists( 'ninja_forms_display_form' ) ){ ninja_forms_display_form( 22 ); } ?>
</div>

文本区域的类是"电子邮件文本区域"

提交按钮的类是"email-sub"

Answer 1

首先，您需要为字段指定一些类 - http://prntscr.com/bdalyh然后添加一些样式：

.subscribe__email-wrap{
  float:left;
  width:calc(100% - 100px);
}
.subscribe__submit-wrap{
  float:right;
  width:100px;
}

请注意，您应该在末尾添加-wrap样式字段 contaienr，而不是直接添加字段。最后，您需要在表单中添加一些clearfix样式：

.ninja-forms-all-fields-wrap:after{
  content:'';
  display:table;
  clear:both;
}