Display List of Custom Taxonomy Terms in Responsive Columns using Semantic Grid

Hello Tom

I hope you and your family are doing well.

I have a curly one for you today.

I have written some php and css.

I am using it to display a list of term links from a custom taxonomy. It works nicely to create a long list. I have added some simple css to style the layout and links.

What I want to do however, is to format the PHP so that the resulting list is displayed in 3 responsive columns using GP's semantic grid-33 divs.

How can I code this?

Here are some articles I found where people using other themes have created their taxonomy term list in columns:

Taxonomy List
Multiple Columns

PHP
The echo section of my php is as follows:

echo "<h1 class='vendor-title'>MY TITLE</h1>"; 
        echo "<p class='vendor-subtext'>My subtext.</p>";
   		echo "<ul class='vendor-list'>";
		foreach ( $terms as $term ) {
			echo '<li><a href="' . get_term_link( $term ) .'">' . $term->name . '</a></li>';
		}
		echo "</ul>";

CSS

.vendor-title {
    margin-top:75px;
}

.vendor-subtext {
    font-weight:600;
} 

.vendor-list {
    font-size:14px;
    list-style-type: none;
  
}

.vendor-list a:hover {
   color:blue;
}

Thanks in advance for your valuable assistance.

Kind Regards

Max