Блог

Почему мои загрузочные карточки выровнены друг над другом, а не рядом по всей странице?

Это html, который у меня есть. Остальная часть веб-интерфейса работает нормально. Не уверен, в чем проблема с этими карточками и почему они не будут выравниваться рядом.

 <div class="container-fluid padding">
<div id="row" class="row padding">
    <div class="col-md-4">
        <div class="card">
            <img class="card-img-top" src="grow.png">
                <div class="card-body">
                <h4 class="card-title">John Doe</h4>
                <p>This is just going to be information about about
                the company and wh
                </p>
                <a href="#" class="btn btn-outline-secondary">See Profile</a>
                </div>
        </div>
    </div>
</div>


    <div class="col-md-4">
        <div class="card">
            <img class="card-img-top" src="grow.png">
                <div class="card-body">
                <h4 class="card-title">John Doe</h4>
                <p>This is just going to be information about about
                the company and wh
                </p>
                <a href="#" class="btn btn-outline-secondary">See Profile</a>
                </div>
        </div>
    </div>


    <div class="col-md-4">
        <div class="card">
            <img class="card-img-top" src="grow.png">
                <div class="card-body">
                <h4 class="card-title">John Doe</h4>
                <p>This is just going to be information about about
                the company and wh
                </p>
                <a href="#" class="btn btn-outline-secondary">See Profile</a>
                </div>
        </div>
    </div>

</div>
 
  

Вы забыли закрыть свой тег div. Это должно сработать.

  <div class="container-fluid padding">
  <div id="row" class="row padding">
    <div class="col-md-4">
      <div class="card">
        <img class="card-img-top" src="grow.png" />
        <div class="card-body">
          <h4 class="card-title">John Doe</h4>
          <p>
            This is just going to be information about about the company and
            wh
          </p>
          <a href="#" class="btn btn-outline-secondary">See Profile</a>
        </div>
      </div>
    </div>

    <div class="col-md-4">
      <div class="card">
        <img class="card-img-top" src="grow.png" />
        <div class="card-body">
          <h4 class="card-title">John Doe</h4>
          <p>
            This is just going to be information about about the company and
            wh
          </p>
          <a href="#" class="btn btn-outline-secondary">See Profile</a>
        </div>
      </div>
    </div>

    <div class="col-md-4">
      <div class="card">
        <img class="card-img-top" src="grow.png" />
        <div class="card-body">
          <h4 class="card-title">John Doe</h4>
          <p>
            This is just going to be information about about the company and
            wh
          </p>
          <a href="#" class="btn btn-outline-secondary">See Profile</a>
        </div>
      </div>
    </div>
  </div>
</div>