PHP to HTML: Manage horizontal list with dynamic content

Question

I'm creating a horizontal button list with content feed from server. The list breaks to another line when the content overflows.

Each button can have text of random length, so breaking it in certain point won't work. What i want to achieve is the last line of contents to be longer (or at-least equal) to the above list contents

Php code:

<ul class="tab-menu__items">
    <?php if ($related_products): ?>
        <?php foreach ($related_products as $key => $related_product): ?>
            <li class="tab-menu__item">
                <a href="#" class="tab-menu__link">
                    <?php echo $related_product['product_name']; ?>     
                </a>
            </li>
        <?php endforeach; ?>
    <?php endif; ?>
</ul>

Answer 1

I think for displaying " last line of contents to be longer (or at-least equal) to the above list contents" first need to sort the array based on the length of array value

<ul class="tab-menu__items">
    <?php if ($related_products): ?>
        <?php array_multisort(array_map('strlen', $related_products), $related_products);?>    
        <?php foreach ($related_products as $key => $related_product): ?>
            <li class="tab-menu__item">
                <a href="#" class="tab-menu__link">
                    <?php echo $related_product['product_name']; ?>     
                </a>
            </li>
        <?php endforeach; ?>
    <?php endif; ?>
</ul>