Flexbox décortiqué à travers 18 vidéos
CSS3 Flexbox est l'une des dernières révolutions des spécifications CSS et nous facilite la vie tous les jours. Pourtant, il est parfois taquin et peu intuitif, notamment lorsque l'on s'attaque au trio de propriétés flex-grow, flex-shrink et flex-basis.
L'un de nos membres actifs du forum, lionel_css3, va devenir votre meilleur ami puisqu'il vient de publier une Série de vidéos d'apprentissage de Flexbox sur sa chaîne Youtube.
Durant 4h30 et près d'une vingtaine de vidéos, Lionel consolide petit à petit les bases de cette spécification plus complexe qu'il n'y paraît.
Au programme des réjouissances
- quelques vidéos d'introduction et partie pratique
- une vidéo sur
inline-flex - 3 vidéos sur Flexbox et Bootstrap
- 1 vidéo sur Flexbox et la gestion des images
- plusieurs vidéos d'exercices pratiques et un projet de mise en page complexe
À toutes fins utiles, l'auteur précise que cette chaine Youtube est gratuite, non monétisée, sans publicités et que son contenu est destiné au partage, sans aucune démarche commerciale.
Commentaires
Génial !! merci Raphaël ????
@lionel_css3 : les "????" devaient être un smiley, dans ma réponse lol
Super vidéos, j'ajouterai aussi ce lien : https://flexboxfroggy.com/#fr
C'est un petit jeu qui m'a vraiment beaucoup aidé à comprendre le positionnement grâce à Flexbox, lorsqu'on débute ca aide à mettre en pratique !
Intéressant. Je crois que je ne vais pas avoir le choix que de me mettre à cette méthode d'apprentissage car j'accuse de quelques lacunes sur ce modèle de boîte.
En tous les cas, 4h30, whao quelle masse de travail ça doit représenter ?!
Merci Lionel pour tout ce taff et merci Alsa pour être agrégateur de pépites telles que celle-ci.
@Greg_Lumiere : " En tous les cas, 4h30, whao quelle masse de travail ça doit représenter ?!"
une masse de travail assez conséquente, je te l'accorde :-) .... je dirais facteur 8 environ: 8H de travail pour une 1H de vidéo....
Beau travail, bien fait , très didactique. Merci.
Je diffuse le lien chez mes amis qui rament avec flexbox (et moi aussi...)
@julienldt :
Il me semble qu'il y a un bug avec "align-content: stretch;" à la page 21 dans ce jeu proposé par ton lien. À moins que ce soit le contexte de cet exemple qui fait qu'il n'y a pas de différence entre "align-content: stretch;" et align-content: space-between;"
@Bongota : heu.. tu t'adressais à qui là? ;-)
Super. Merci bien
@lionel_css3 : C'est un bug du site qui garde en mémoire le textarea. Si tu valides au mauvais endroit...
Bonjour à tous,
Dans la playlist il y avait une erreur, la vidéo n°11 était incorrecte (c'était la même que le 12)
Je viens de corriger cela... :-)