[Bootstrap] Alignement de divs de tailles variables sur 2 colonnes

Bonjour,
dans un contexte Bootstrap, j'ai une série de divs de largeur constante span6 à l'intérieur d'un span12, mais dont la hauteur peut varier. Les divs sont bien organisées sur 2 colonnes, mais " de temps en temps" bootstrap en met deux en vis à vis gauche-droite, ce qui fait que j'ai des espaces très grands parfois entre 2 divs dans la même colonne.
J'ai essayé beaucoup de choses mais je n'aboutis pas. Ce que j'ai obtenu de plus intéressant comme résultat c'est d'utiliser le "column-count: 2;" sur mon span12, le problème alors c'est que la dernière div de la colonne de gauche est coupée pour se terminer dans la colonne de droite.
Quelqu'un a-t-il une solution ? La page concernée est celle-ci: http://site.ecostrategie.com/?-Qui-sommes-nous-

Merci !
Mikhaël

Bonjour,
je n'ai pas réussi à visualiser, en allant sur la page en lien, où se trouvait ton soucis !?!

Bonjour,

1/ il est possible aussi qu'un "simple" display:flex; avec flex-direction:column; et flex-wrap:wrap; pourrait suffire ici.
[edit] Après test, il faut définir/fixer la hauteur du conteneur (ce qui n'est pas jouable...)

2/ Concernant column-count:2; ça peut fonctionner en mettant sur les div enfants break-inside :

Code:

---

1 2 3 4 5 6 7

.span6 { width:98%; float:none !important; box-sizing:border-box; margin:0 1% 30px 1%; break-inside:avoid; page-break-inside:avoid; -webkit-column-break-inside: avoid; }

---

+ supprimer les class "placeLeft" et "placeRight" (et supprimer la class "row" sur le parent, qui ne sert à rien)

Néanmoins, la compatibilité laisse encore à désirer...


3/ Pour aller plus loin :google: :

• isotope (bootstrap)
• masonry (bootstrap)
• Packery