title: bootstrap 4 cards with php foreach loop
body: <p>Iam trying to get my web page to display all of my shop items in bootstrap 4 cards. 3 wide by however many deep ( i may add pagination another day ) </p>
  
  <p>I've got a php foreach loop which populates bootstrap4 cards perfectly. The trouble is they display vertically ( one on top of the other ) . ive tried class= columns which works on dummy divs  but not when i integrate with my for each loop. </p>
  
  <p>I ve tried everything regarding bootstrap docs but cant get the cards to display 3 wide and however many deep ( the foreach and the items control this. ) </p>
  
  <p>Should i be even using 'cards' or use something else. thx for your time</p>
  
  <pre><code>    &lt;div class="container"&gt;
  
  
      &lt;!-- $result = my php code using x-path to get results from xml query goes here. --&gt;
  &lt;?php 
      foreach ( $result as $elements){
    ?&gt;
  
  
  
         &lt;div class="row-fluid "&gt;
      &lt;div class="col-sm-4 "&gt;
  &lt;div class="card-columns-fluid"&gt;
  
      &lt;div class="card  bg-light" style = "width: 22rem; " &gt;
  
        &lt;img class="card-img-top"  src=" &lt;?php echo $elements-&gt;pictures-&gt;picture[2]-&gt;filename  ; ?&gt; " alt="Card image cap"&gt;
  
        &lt;div class="card-body"&gt;
          &lt;h5 class="card-title"&gt;&lt;b&gt;&lt;?php echo $elements-&gt;advert_heading ?&gt;&lt;/b&gt;&lt;/h5&gt;
           &lt;p class="card-text"&gt;&lt;b&gt;&lt;?php echo $elements-&gt;price_text ?&gt;&lt;/b&gt;&lt;/p&gt;
          &lt;p class="card-text"&gt;&lt;?php echo $elements-&gt;bullet1 ?&gt;&lt;/p&gt;
          &lt;p class="card-text"&gt;&lt;?php echo $elements-&gt;bullet2 ?&gt;&lt;/p&gt;
          &lt;a href="#" class="btn btn-secondary"&gt;Full Details&lt;/a&gt;
  
       &lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;
  
      &lt;?php
          }
        }
      ?&gt;
  
      &lt;/div&gt; 
       &lt;/div&gt; &lt;!--container close div  --&gt;
  </code></pre>