Как с for выставить 4 div блока

Всем привет, я извиняюсь за то что плохо написал названия вопроса, особо не пинайте, если не так написал, подскажите как правильно в таких случаях задать вопрос?

Дело в том у на морде есть вывод категорий с ее под категориями. мне надо расположить по 4 div блока.

Например: 1-категория(под категориями) 2-категория(под категориями) 3-категория(под категориями) 4-категория(под категориями)

div Block | div Block | div Block | div Block дальше идет повторение div Block | div Block | div Block | div Block div Block | div Block | div Block | div Block

Помогите как правильно реализовать?

здесь я вывожу сами категории с под категориями

<div class="category-block">
                <div class="category-item">
                    <?php foreach ($tree as $cat) : ?>
                        <button class="sub-menu"><span class="cat img1"></span>
                            <p class="cat"><?= $cat['title'] ?></p></button>
                        <div class="sub-menu-item">
                            <ul>
                                <li class="all">
                                    <a href="#">Проглянути всі оголошення <img src="img/arrow-right.png"></a>
                                </li>
                                <?php if ($cat['childs'] > 0) : ?>
                                    <?php foreach ($cat['childs'] as $child) : ?>
                                        <li>
                                            <a href="<?= Url::to(['category/index', 'id' => $child['id']]) ?>">
                                                <i class="fa fa-angle-right" aria-hidden="true"></i>
                                                <?= $child['title'] ?>
                                            </a>
                                        </li>
                                    <?php endforeach; ?>
                                <?php endif; ?>
                            </ul>
                        </div>
                    <?php endforeach; ?>
                </div>
            </div>

а вот пример верстки, как должно быть

<div class="category-block">
            <div class="category-item">
                <button class="sub-menu"><span class="cat img1"></span><p class="cat">Кур'єрські послуги</p></button>
                <div class="sub-menu-item">
                    <ul>
                        <li class="all"><a href="#">Проглянути всі оголошення <img src="img/arrow-right.png"></a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Послуги вантажників</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Перевезення меблів і побутової техніки</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Вивіз сміття</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Пасажирські перевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Інші вантажоперевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Переїзди</a></li>
                    </ul>
                </div>
            </div>
            <div class="category-item">
                <button class="sub-menu"><span class="img2 cat"></span><p class="cat">Клінінгові послуги</p></button>
                <div class="sub-menu-item">
                    <ul>
                        <li class="all"><a href="#">Проглянути всі оголошення <img src="img/arrow-right.png"></a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Послуги вантажників</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Перевезення меблів і побутової техніки</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Вивіз сміття</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Пасажирські перевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Інші вантажоперевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Переїзди</a></li>
                    </ul>
                </div>
            </div>
            <div class="category-item">
                <button class="sub-menu"><span class="img3 cat"></span><p class="cat">Автопослуги</p></button>
                <div class="sub-menu-item">
                    <ul>
                        <li class="all"><a href="#">Проглянути всі оголошення <img src="img/arrow-right.png"></a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Послуги вантажників</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Перевезення меблів і побутової техніки</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Вивіз сміття</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Пасажирські перевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Інші вантажоперевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Переїзди</a></li>
                    </ul>
                </div>
            </div>
            <div class="category-item">
                <button class="sub-menu"><span class="img4 cat"></span><p class="cat">Послуги краси</p></button>
                <div class="sub-menu-item">
                    <ul>
                        <li class="all"><a href="#">Проглянути всі оголошення <img src="img/arrow-right.png"></a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Послуги вантажників</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Перевезення меблів і побутової техніки</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Вивіз сміття</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Пасажирські перевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Інші вантажоперевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Переїзди</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="category-block">
            <div class="category-item">
                <button class="sub-menu"><span class="img5 cat"></span><p class="cat">Транспортні та складські послуги</p></button>
                <div class="sub-menu-item">
                    <ul>
                        <li class="all"><a href="#">Проглянути всі оголошення <img src="img/arrow-right.png"></a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Послуги вантажників</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Перевезення меблів і побутової техніки</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Вивіз сміття</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Пасажирські перевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Інші вантажоперевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Переїзди</a></li>
                    </ul>
                </div>
            </div>                      
            <div class="category-item">
                <button class="sub-menu"><span class="img6 cat"></span><p class="cat">Ділові послуги</p></button>
                <div class="sub-menu-item">
                    <ul>
                        <li class="all"><a href="#">Проглянути всі оголошення <img src="img/arrow-right.png"></a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Послуги вантажників</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Перевезення меблів і побутової техніки</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Вивіз сміття</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Пасажирські перевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Інші вантажоперевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Переїзди</a></li>
                    </ul>
                </div>
            </div>
            <div class="category-item">
                <button class="sub-menu"><span class="img7 cat"></span><p class="cat">Реклама, маркетинг, PR</p></button>
                <div class="sub-menu-item">
                    <ul>
                        <li class="all"><a href="#">Проглянути всі оголошення <img src="img/arrow-right.png"></a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Послуги вантажників</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Перевезення меблів і побутової техніки</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Вивіз сміття</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Пасажирські перевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Інші вантажоперевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Переїзди</a></li>
                    </ul>
                </div>
            </div>
            <div class="category-item">
                <button class="sub-menu"><span class="img8 cat"></span><p class="cat">Тату майстра</p></button>
                <div class="sub-menu-item">
                    <ul>
                        <li class="all"><a href="#">Проглянути всі оголошення <img src="img/arrow-right.png"></a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Послуги вантажників</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Перевезення меблів і побутової техніки</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Вивіз сміття</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Пасажирські перевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Інші вантажоперевезення</a></li>
                        <li><a href="#"><i class="fa fa-angle-right" aria-hidden="true"></i>Переїзди</a></li>
                    </ul>
                </div>
            </div>
        </div>