Retour aux cas pratiques
Tailwind CSSAvancé
Refactorisation d'un layout complexe vers une grille responsive Tailwind
Scénario
Contexte : Vous reprenez un dashboard construit avec Tailwind où les widgets sont positionnés avec des largeurs fixes et des marges manuelles. Le Problème : L'affichage casse sur tablette et mobile car la structure ne s'adapte pas correctement aux différentes tailles d'écran. Contraintes : Utiliser uniquement les classes utilitaires Tailwind (grid, col-span, breakpoints). Aucun CSS personnalisé. Code actuel : <div class="flex"> <div class="w-1/4">Sidebar</div> <div class="w-3/4">Content</div> </div> Livrable attendu : Refactoriser le layout en utilisant une grille responsive avec breakpoints adaptés pour desktop, tablette et mobile.
Compétences ciblées
tailwindgridresponsivelayoutdashboard