Сеточная система начальной загрузки не показывает правильное разделение столбцов

#html #css

Вопрос:

Привет, короче говоря, в баре над «Сотрудниками AllDay Market» есть div col md 12, под каждым div-col md 6, на левой фотографии (синяя рубашка) div в полном порядке, на втором div ( желтая рубашка) вы видите, что рядом с ним много пустого места, это связано с заполнением и полями или чем-то еще?

                             <div class="col-md-6">
                          <div class="product-item">
                           <a href="#"><img src="'.$img.'" height="370px" width="270px" alt="">
                           <div class="down-content">
                            <center><strong>'.$firstname.' amp;nbsp '.$lastname.'</strong><small>('.$ID.')</small></center>
                             </div>
                              <br>
                              <div>
                              <ul>
                              <li><strong>PerHour:</strong>₪'.$perhour.'</li>
                              <li><strong>Residence:</strong>'.$residence.'</li>
                              <li><strong>PIN:</strong>'.$pin.'</li>
                              </div>
                              <div>
                        <a href="editEmployeeForm.php?id='.$ID.'">
                         <button class="btn btn-secondary" type="button" class="filled-button" class="editBtn">Edit</button>
                         </a>
                         <form action="updateEmployee.php" method="post">
                         <input type="hidden" name="id" value="'.$ID.'">
                         <fieldset>
                         <button type="submit" name="employeeDel" id="form-submit" class="btn btn-danger">Delete</button>
                         </fieldset>
                         </form>
                            </div>
                          </div>
                        </div>

1. отформатируйте свой код. Может быть , это только решит вашу проблему..похоже a , ul теги закрыты неправильно

2. Я закрыл их, и ничего не произошло :/

3. поделитесь полным кодом вместе с col-12 и пользовательским стилем

Ответ №1:

Ваш код очень понятен. Попробуйте отформатировать свой код. Здесь я даю вам некоторую информацию. Для создания bootstrap gird вам необходимо создать раздел строк в качестве родительского раздела сетки. Как это-

 <div class="row">
  <div class="col-md-6">
   ......
  </div>
  <div class="col-md-6">
   ......
  </div>
  <div class="col-md-6">
   ......
  </div>
</div>

В качестве кода вы указываете ширину изображения. Вот почему вы можете понять, содержит ли сетка всю ширину. Вы можете удалить его, придав ширину 100%.

 <img src="'.$img.'" height="370px" width="270px" alt="">

В вашем коде где-то вы не указываете пустой тег. Пожалуйста, заполните его. И следуйте документации по начальной загрузке.