forms - Ninja Forms - 对齐文本区域并提交按钮

Question

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

<div class="email-form-wrap">

<?php if( function_exists( 'ninja_forms_display_form' ) ){ ninja_forms_display_form( 22 ); } ?>

</div>

textarea 的类是“email-text-area”

提交按钮的类是'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;
}