How do I display my custom posts in a grid

Hello,

I would like to display my custom posts in a grid (e.g. 5 columns). Currently, they are displayed in a list. You can see this here.

Please can you show me how to modify my custom-post-type-template code below to do this:

<?php
/**
 * Template Name: Artist Custom Post Type
 **/

 get_header(); ?>
<div id="content" class="site-content container">
	<div id="primary" class="content-area col-sm-12 col-md-12 <?php echo of_get_option( 'site_layout', 'no entry' ); ?>">
		<main id="main" class="site-main" role="main">

                <h3>Browse through Shropshire's leading artists?specialising in oil, textiles, sculpture, and watercolour</h3>
                <br> <br />

			<?php
  			$args=array('post_type' => 'artist', 'post_status' => 'publish', 'orderby' => 'title', 'order' => 'asc', 'posts_per_page' => 18);
			$my_query = new WP_Query( $args );

    			while ($my_query->have_posts()) : $my_query->the_post();
			?>

				<?php
                        	$image = get_field('artwork_example_1');
		        	if( !empty($image) ): ?>
				<p><img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" width="140px" height="110px"/></p>
				<?php endif; ?>
                        	<p><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php              the_title_attribute(); ?>"><?php the_title(); ?></a></p>

			<?php endwhile; // end of the loop. ?>	

		</main><!-- #main -->
	</div><!-- #primary -->

<?php get_footer(); ?>

Many thanks for your help