GRID ou FLEX pour 2 ou 3 lignes selon contenu ?

gcyrillus a écrit :
@boteha,

dans ce cas , flex et flex-wrap sont probablement plus proche, sans avoir a jouer avec des medias truc.
https://codepen.io/gc-nomade/pen/JjqvLpx teste avec resize aussi pour suivre un comportement générique quelque soit la largeur

.act {
  display:flex;
  flex-wrap:wrap;
  gap:1em;
}

boteha_2 a écrit :
Cela revient à dire que E3 occupe forcément toute la largeur.

a {
  border:solid;
  padding:1em;
  flex:1 1 auto;
}
a:last-of-type{flex-basis:100%;}

boteha_2 a écrit :
Bonsoir gcyrillus,

Merci pour tes précisions.

Dans le cas qui m'intéresse, avec FLEX y a-t-il un moyen d'avoir l'effet tableau en se basant sur la largeur de l'élément le plus large, et non sur la largeur du parent ?

C'est là où je sèche.

Je subodore que ce n'est pas possible.

gcyrillus a écrit :

heu oui, https://codepen.io/gc-nomade/pen/ExzBYxj la je force le troisième à avoir un min-width:15em; et je met panier en width:min-content; , le min-width n'est pas necessaire mais il y a des chances que tu ai alors toujours 3 lignes si tu ne détermine pas une largeur minimale à l'avance.

boteha_2 a écrit :
Bonjour,
....
J'aurais préféré une solution 100% fluide (sans min-width) mais cela semble impossible.

gcyrillus a écrit :

Bonjour,
C'est possible si le 3eme a suffisamment de texte pour être plus large que la somme des deux premiers + le gap, c'est juste peu probable ici d'où un min-width bien utile et ça aère un peu aussi je crois.