Atelier Flexbox CSS — gratuit en ligne
Aligner les blocs comme on veut avec flexbox, ça ressemble parfois à deviner. On change un réglage, la mise en page saute, et on tâtonne jusqu'à ce que quelque chose tienne. Nous avons ajouté un outil gratuit qui vous évite ces allers-retours — CSS Flexbox Playground — directement dans votre navigateur.
Ce qu'il fait
Vous cliquez sur les propriétés flexbox et les blocs se réorganisent devant vous, en temps réel. Essayez différentes directions, espacements et alignements jusqu'à ce que la mise en page vous convienne, puis copiez le CSS du conteneur. C'est une façon rapide de vraiment comprendre comment fonctionne flex et de récupérer le code exact dont vous avez besoin.
Rien ne quitte votre appareil
Tout se passe dans votre navigateur. Rien n'est envoyé et rien n'est enregistré sur un serveur : vous jouez simplement avec un aperçu en direct sur votre propre écran. Vous fermez l'onglet et tout disparaît.
Comment l'utiliser
- Ouvrez CSS Flexbox Playground dans votre navigateur.
- Cliquez sur les propriétés flexbox et regardez les blocs se réorganiser jusqu'à ce que la mise en page vous plaise.
- Copiez le CSS du conteneur et collez-le dans votre projet.
C'est gratuit et sans limite. Vous trouverez d'autres petits outils sur la page Apps.