Catégories
Astuces et Design

grid-auto-flow: CSS Grid :: flex-direction: Flexbox

Lors de la définition d'un élément parent sur display: flex, ses éléments enfants s'alignent de gauche à droite comme ceci: CodePen Embed Fallback Maintenant, l'une des choses intéressantes que nous pouvons faire avec flexbox est de changer la direction afin que les éléments enfants soient empilés verticalement les uns sur les autres dans une colonne. […]

Catégories
Astuces et Design

Équilibrage sur un pivot avec Flexbox

Laissez-moi vous montrer une façon que j'ai récemment découverte de centrer un tas d'éléments autour de ce que j'appelle le pivot. Je vous promets que le HTML génial est hors de question et que vous n’avez pas besoin de connaître un CSS de pointe pour faire le travail. Je suis passionné par les jeux de […]

Catégories
Astuces et Design

Grille pour la mise en page, Flexbox pour les composants

Mon frère est un nouveau diplômé en génie informatique et il termine actuellement son stage en développement front-end. Il a appris à la fois la grille CSS et la flexbox, mais j'ai remarqué un modèle que je vois beaucoup sur le Web. Il ne peut pas décider quand utiliser la grille ou la flexbox. Par […]

Catégories
Astuces et Design

Le chrome atteint l'écart Flexbox

Les moteurs de mise en page CSS Flexbox et Multi-Column de Chromium prennent désormais en charge gap. grid-gap est de vieilles nouvelles. 7 mai 2020 CSS Grid a apporté une délicieuse fonctionnalité d'espacement appelée grid-gap, qui est rapidement devenu un moyen populaire de mettre de l'espace dans les mises en page. Il était facile de […]