Comment masquer les onglets sur les petits écrans ?

Question

J'ai un menu antd avec des étiquettes et des icônes. Il s’agit de la représentation minimale du design. Codesandbox

Maintenant, ce que je veux, c'est masquer l'étiquette et afficher l'icône uniquement lorsque le menu commence à afficher des points de suspension. Comme je ne connais pas très bien CSS, je me demandais si cette fonctionnalité pouvait être obtenue via antd.

Answer 1

Vous devez utiliser des requêtes multimédias et définir l'étiquette pour qu'elle n'en affiche aucune en dessous d'une taille spécifique.

@media only screen and (max-width : 768px) {
    span.ant-menu-title-content {
    display: none;
    }
}

Je vous recommande personnellement d'utiliser celui ci-dessus (c'est le moyen le plus courant de basculer entre ordinateur et mobile)

Enfin, pensez à utiliser justifier-contenu : éléments de menu centre à centre sur les appareils mobiles :)