0

I am trying to create a grid of three columns per row but the columns are stacking up vertically not horizontally as intended. I am trying to create a grid of three columns per row but the columns are stacking up vertically not horizontally as intended. 

<footer>
  <div class="container-fluid bg-gray p-a-1 c-darkblue m-t-2">
   <div class="row">
  <div class="col-md-9">
    <div class="col-md-12">
      <div class="col-md-4">
        <div *ngFor="let item of helpData; let ndx=index">
          <div *ngIf="ndx==0">
            <h5 class="c-black">{{item.header}}<br></h5>
          </div>
          <ul class="list-style-none font-bold f-1 line-ht-1pt5">
            <li class="m-ln-2pt3">{{item.menu}}<i class="fa fa-caret-right m-l-pt5"></i></li>
          </ul>
        </div>
      </div>

      <div class="col-md-4">
        <div *ngFor="let item of flyersData; let ndx=index">
          <div *ngIf="ndx==0">
            <h5 class="c-black">{{item.header}}<br></h5>
          </div>
          <ul class="list-style-none font-bold f-1 line-ht-1pt5">
            <li class="m-ln-2pt3">{{item.menu}}<i class="fa fa-caret-right m-l-pt5"></i></li>
          </ul>
        </div>
      </div>

      <div class="col-md-4">
        <div *ngFor="let item of flyersData; let ndx=index">
          <div *ngIf="ndx==0">
            <h5 class="c-black">{{item.header}}<br></h5>
          </div>
          <ul class="list-style-none font-bold f-1 line-ht-1pt5">
            <li class="m-ln-2pt3">{{item.menu}}<i class="fa fa-caret-right m-l-pt5"></i></li>
          </ul>
        </div>
      </div>
    </div>
  </div>

  <div class="col-md-3 c-black">
  </div>
</div>

koque
  • 1,830
  • 5
  • 28
  • 49
  • http://getbootstrap.com/docs/4.0/layout/grid/#nesting – Carol Skelly Mar 22 '18 at 17:15
  • The questions are only related in that they have the same title. The basic problems are not the same. The solution to the question you referenced is that in Bootstrap 4, In a grid layout, content must be placed within columns and only columns may be immediate children of rows.. That is clearly not the same problem as mine. My columns are already placed within rows. – koque Mar 22 '18 at 17:21
  • 1
    No, the nested columns are not in rows. – Carol Skelly Mar 22 '18 at 17:24
  • You are right. Thanks. – koque Mar 22 '18 at 17:28

0 Answers0