Ich habe die folgenden Karten. nav Es gibt viele Projekte (ich habe der Kürze halber eines hier behalten).

<div class="col-md-3">
    <div class="card">
        <div class="card-header">
            <h3 class="card-title">title</h3>
        </div>
        <div class="card-body p-0">
            <ul class="nav nav-pills flex-column">
                <li class="nav-item">
                    <NavLink href="javascript: void(0);" @onclick="() => ShowSearch()" class="nav-link">
                        <span class="fa-li pl-5"><i class="fas fa-search" /></span>
                        <span class="pl-4">Search</span>
                    </NavLink>
                </li>
            </ul>
        </div>
        <div class="card-footer">
            <NavLink href="Back" class="nav-link">
                <span class="fa-li pl-5"><i class="fas fa-arrow-alt-circle-left"/></span> 
                <span class="pl-1">Back</span>
            </NavLink>
        </div>
    </div>
</div>

Alle Inhalte werden auch auf Mobilgeräten korrekt angezeigt.

Allerdings würde ich gerne wissen, ob es möglich ist, die Navigationsliste in eine Art Symbolleiste (immer noch im Kartenkörper) „umzuwandeln“ und Elemente nebeneinander anzuzeigen und nur ihre Symbole anzuzeigen. Dinge wie diese:

Ist es möglich?