Split foreach loop results over multiple columns - php

Question

I'm currently listing all my interests inside one div. However, I'd like to spread these across columns. So have 4 interests per column. How can I change my CSS to allow this?
<?php
$interests = get_terms('interests',array( 'taxonomy' => 'interests' ));
foreach($interests as $term){
echo '<li>'.$term->name.'</li>';
}
?>
Preferred HTML output:
<div class="columns">
<ul>
<li>F1</li>
<li>Cycling</li>
<li>Football</li>
<li>Rugby</li>
</ul>
</div>
<div class="columns">
<ul>
<li>Running</li>
<li>Swimming</li>
</ul>
</div>

Answer 1

<?php
$interests = get_terms('interests',array( 'taxonomy' => 'interests' ));
echo '<div class="columns">';
$index = 0;
foreach($interests as $term){
if ($index > 0 and $index % 4 == 0) {
//if not the first row and dividable by 4
echo '</div><div class="columns">';
}
echo '<li>'.$term->name.'</li>';
$index++;
}
echo '</div>';
?>
For you comment:
$interests = get_terms('interests',array( 'taxonomy' => 'interests' ));
$count = count($interests);
$numItemsPerRow = ceil($count / 3);
//we need this in case of 2-1-1 for example, otherwise you get 2-2
$numItemsOffsetFix = $count % 3 == 1;
$index = 0;
echo '<div class="columns">';
foreach($interests as $term){
if ($index > 0 and $index % $numItemsPerRow == 0) {
echo '</div><div class="columns">';
if ($numItemsOffsetFix) {
$numItemsPerRow--;
$numItemsOffsetFix = false;
}
}
echo '<li>'.$term->name.'</li>';
$index++;
}
echo '</div>';