Html 将错误消息放在匹配的输入WordPress下面

正如我在标题中所说，我想在匹配输入下显示错误消息

我正在使用WordPress4.7.5，并联系Form7插件

现在我知道了：

通常我的表格是这样的：

这是我的HTML（在联系人表单7插件中）：

}

您必须知道生成的HTMl是：

希望你能有个主意

<div class="inp-form">[text* your-name class:obligatoire placeholder "Nom*"]</div>
<div class="inp-form">[text* your-name class:obligatoire placeholder "Prénom*"]</div>
<div class="inp-form">[email* your-email class:obligatoire placeholder "Email*"]</div>
<div class="inp-form">[tel* tel id:tel class:obligatoire  placeholder "Téléphone*"]</div>

 form.wpcf7-form{
> .inp-form{
  display: inline;
  width: auto;

  input[type=text], input[type=email], input[type=number], input[type=tel]{
    width: calc( 50% - 5px );
  }

  &:nth-child(odd){
    input{
      float: right;
    }
  }
}

input[type=text], input[type=email], input[type=number], input[type=tel], textarea{
  color: #999;
  background-color: #eee;
  padding: 16px;
  border: 0;
  margin-bottom: 10px;
  height: auto;
  border-radius: 0;
}

.radio-first{
  display: inline;
  padding: 10px 0;
  float: left;
}

.radio-last{
  display: inline;
  padding: 10px 0;
  float: right;
}

textarea{
  width: 100%;
}

input[type=submit]{
  float: right;
}

.wpcf7-mail-sent-ok{
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #d6e9c6;
  padding: 5px;
  border-radius: 3px;
}

.wpcf7-not-valid-tip {
  color: #a94442;
  background-color: #f2dede;
  border-color: #ebccd1;
  padding: 5px;
  border-radius: 3px;
  width: calc( 50% - 5px );
  display: none;
}

.wpcf7-validation-errors{
  color: #8a6d3b;
  background-color: #fcf8e3;
  border-color: #faebcc;
  padding: 5px;
  margin: 20px 0 0;
  border-radius: 3px;
  display: none;
}