wordpress 投稿一覧を3行3列に配置したいです。

前提・実現したいこと

teratailで初めての質問をさせていただきます。
浅い知識での質問となりますが、お手柔らかにお願いします。

ーーーーーーーーーーーーーーーーー

現在事業サイトをwordpressで作成しておりまして、「制作実績一覧ページ」に制作実績をカスタム投稿タイプで作成し管理画面の投稿から投稿しておりま
す。

上のの画像のように９枚並んでいるのを３行にし、
下の画像のように一行３つの制作実績を載せたいのですがこちらカスタム投稿タイプから作成しておりまして、一行３つに並べるにはどのようにコーディングすればよいかわかりません。
htmlのみのコーディングでしたら親要素を３つにして、３行作成するのですが、サブループでの投稿になりどのようにコーディングすればいいかわからない状態です。

下のソースコードのpiece-itemのところがパネルになっているのですが、これを１行に３段でかつ３行ある状態にしたいのですが、どのようにコーディングすればよいかわかりません。ググり方のヒントだけでもいただけますと幸いです。
よろしくお願いします

該当のソースコード

こちらが上でお話した制作実績一覧ページのコードです。

<main class="piece">
    <div class="cmn-mv"></div>
    <section class="piece-wrapper">
        <div class="inner">
            <div class="piece-cont">
                <ul class="piece-list">
<?php
$query_args = array(
    'post_status' => 'publish',
    'post_type' => 'works',
    'order' => 'DESC',
    'post_per_pages' =>9,
);
$the_query = new WP_Query( $query_args );
if ( $the_query->have_posts() ):
    while ( $the_query->have_posts() ):
        $the_query->the_post();
        $link = get_permalink( $post->ID );
        $thumbnail = (get_the_post_thumbnail_url( $post->ID, 'medium' )) ? get_the_post_thumbnail_url( $post->ID, 'medium' ) : get_template_directory_uri().$NO_IMAGE_URL;
        $title =get_the_title( $post->ID );
        $link =get_permalink( $post->ID );
?>
                    <li class="piece-item">
                        <a class="piece-box "href="<?php echo $link;?>">
                            <div class="title"><?php echo $title;?></div>
                            <div class="image"><img src="<?php echo $thumbnail;?>" alt=""></div>
                        </a>
                    </li>
<?php
    endwhile;
endif;
wp_reset_query();
?>
                </ul>
            </div>
        </div>