Блог

Я создаю различные группы div.form с использованием PHP и на основе данных из серверной части. Вот так:

 <div class="row">
 <?php foreach($fields as $r){ ?>
  <div class="form-group col-md-6 <?php if($r->description) echo 'desc-fix' ?>">
        <label class="label-heading"><?php echo $r->title ?></label>
        <input type="text" class="form-control" name="field_id_<?=$r->ID?>">
        <span class="help-block"><?=$r->description?></span>
  </div>
 <?php } ?>
</div>
  

Обычно это выглядело бы так

Некоторые поля имеют описание, а некоторые нет. Для тех, у кого есть, я хочу применить min-height: 140px, что я делаю с помощью class desc-fix. Проблема в том, что div.form-group ниже div.desc-fix меняется местами. Как вы можете видеть ниже, одно из полей переключило столбцы.

В качестве исправления я изменил desc-fix таким образом

 .desc-fix   div { min-height: 140px; }
  

Это делает так, что следующий div также будет иметь минимальную высоту: 140 пикселей, но если div.desc-fix находится в правом столбце, элемент в левом нижнем углу также будет иметь минимальную высоту: 140 пикселей. Так что, очевидно, это ничего не исправляет.

В принципе, я хочу применить min-height: 140px к полям, которые соответствуют этим критериям:

• Имеет описание
• Элемент в той же строке всегда должен иметь минимальную высоту: 140 пикселей
• Элементы в следующей строке не должны быть затронуты

Я не знаю, как применять эти правила, хотя