Fill all divs, even when the array is too short - php

Question

I'm developing a WordPress site using Bootstrap. I want to get the first three posts in a category, then loop through them and put all three in a single row.
The trouble is that when a category has only one or two posts the layout is broken, because no markup for the div is written to the page.
<div class="row">
<?php
foreach(array_slice($posts_array, 0, 3) as $post):
?>
<div class="col col-12 col-lg-4">
<?php echo get_the_post_thumbnail(); ?>
<?php echo $post->post_title; ?>
</div>
<?php
endforeach;
?>
</div>
I need this to generate
<div class="row">
<div class="col col-12 col-lg-4">
<img src=image.jpg">
Title
</div>
<div class="col col-12 col-lg-4">
<img src=image2.jpg">
Second Title
</div>
<div class="col col-12 col-lg-4">
<img src=image3.jpg">
Third Title
</div>
</div>
But if a category only has two posts then I get
<div class="row">
<div class="col col-12 col-lg-4">
<img src=image.jpg">
Title
</div>
<div class="col col-12 col-lg-4">
<img src=image2.jpg">
Second Title
</div>
</div>
I'm sure this can't be too hard, but my brain doesn't seem to be working. Please help!

Answer 1

Count the array, try and see if $count % 3 == 0, if not, add fake array elements onto the end, and in your code, just check for something in the fake array that shows it is a real row or not, then you can display a blank box or whatever for the remaining elements.
The other way is starting $x = 1, and incremementing within the loop.

Answer 2

Try This:
<div class="row">
<?php
$val = 3;
$i = 1;
foreach(array_slice($posts_array, 0, $val) as $post):
?>
<div class="col col-12 col-lg-4">
<?php echo get_the_post_thumbnail(); ?>
<?php echo $post->post_title; ?>
</div>
<?php
$i++; endforeach;
?>
<?php for ($j = 0; $j < ($val - $i); $j++) { ?>
// Your Extra Divs.
<?php } ?>