navbar: Wie vermeidet man das Stapeln von Menüpunkten beim Kollaps?

Question

Ich habe eine Navbar und - weil es genug Platz sogar auf xs-Bildschirmen gibt - möchte nur die Titel meiner Optionen entfernen und ihre Symbole stattdessen zeigen, wenn die Breite ausreichend klein ist. Also legte ich den Text in span s mit - und tatsächlich verschwindet es auf xs. Bei xs bekommt jedes Menüelement jedoch eine eigene Zeile, während ich möchte, dass sie float.

Probe here

Ich hoffe, es mit CSS erreicht werden kann, aber nicht wissen, wie. Als Mitarbeiter kommentiert würde dies JS ... und links, so habe ich keine Ahnung, was er meinte ...

Answer 1

fügen Sie einfach diesen

.nav>li { 
    display: inline-block; 
}