[Résolu] Disposition bouton css3 grid et flex

Bonjour,

J'ai une structure html simple avec trois boutons.

Grid : https://jsfiddle.net/uxy65zep/
Flex : https://jsfiddle.net/rj8v647h/

Ma disposition en Grid Layout est parfaite c'est celui que je veux. Par contre, je n'arrive pas à créer la même disposition en utilisant les flexbox.
Le troisime bouton devrait être centré en dessous des deux autres boutons et ce n'est pas le cas.

Merci de l'aide.

Hello,

Voilà pour le flex
Le fait de simplement jouer avec un margin auto aide dans beaucoup de cas (avec Flex).
Autre petit tip, si tu définis `flex-direction` et `flex-wrap`, alors tu peux simplement utiliser `flex-flow` qui prend 2 paramètres (direction et wrap). Par exemple:

a{
   flex-flow: row wrap;
}

Je reviens un peu la dessus, perso je ferais ni flex ni grid… un simple `display: inline-block` sur les <a> avec un bon vieux `text-align: center` sur le parent fera le café.

J'aime beaucoup CSS mais j'aime surtout quand c'est simple La bonne propriété pour le bon affichage en gardant un code simple permettra une bonne lecture/maintenabilité. Ce n'est pas toujours facile à faire d'ailleurs…
Modifié par Yordi (31 Dec 2019 - 07:52)

Merci pour la solution et remarques !