php - why my pagination does not work on mobile screens

hello I am looking for a responsive automatic pagination. For the moment the one I use is automatic but not responsive. The pagination tabs are created as the elements to be paginated

if we don't have many articles we only have a few tabs

but in my case I have to paginate more than 160 articles so this makes me in increments of 10 16 tabs

what I would like is to know how to achieve this is the pagination tab 1/2/3 ..... 10/11/12

here is what is happening for the moment in responsive

how to solve the problem if possible without javascript

   <div class="container" style=" max-width: 100%;margin:auto;">
                    <nav>
                    <ul class="pagination">
                        <!-- Lien vers la page précédente (désactivé si on se trouve sur la 1ère page) -->
                        <li class="page-item <?= ($currentPage == 1) ? "disabled" : "" ?>">
                            <a href="?page=<?= $currentPage - 1 ?>" class="page-link">Précédente</a>
                        </li>
                        <?php for($page = 1; $page <= $pages; $page++): ?>
                          <!-- Lien vers chacune des pages (activé si on se trouve sur la page correspondante) -->
                          <li class="page-item <?= ($currentPage == $page) ? "active" : "" ?>">
                                <a href="?page=<?= $page ?>" class="page-link"><?= $page ?></a>
                            </li>
                        <?php endfor ?>
                          <!-- Lien vers la page suivante (désactivé si on se trouve sur la dernière page) -->
                          <li class="page-item <?= ($currentPage == $pages) ? "disabled" : "" ?>">
                            <a href="?page=<?= $currentPage + 1 ?>" class="page-link">Suivante</a>
                        </li>
                    </ul>
                </nav>
            
        </div>
Copy code