Jak wyrównać lewy ostatni wiersz / linię w wielu wierszach flexbox [duplikat]

Question

May 04, 2013, 09:11 PM

Jak wyrównać lewy ostatni wiersz / linię w wielu wierszach flexbox [duplikat]

To pytanie ma już tutaj odpowiedź:

Flex-box: Wyrównaj ostatni rząd do siatki 24 odpowiedzi

Mam poważny problem z układem Flexbox. Buduję pojemnik z pudełkami wypełnionymi obrazami i postanowiłem użyć układu Flexbox, aby uzasadnić zawartość, aby wyglądała jak siatka

Jej kod:

<div class="container">

    <div class="item"></div>
    <div class="item"></div>
    ...
    <div class="item"></div>

</div>

i CSS:

.container {
    display: flex;
    display: -webkit-flex;
    display: -moz-flex;
    justify-content: space-around;
    -webkit-justify-content: space-around;
    -moz-justify-content: space-around;
    flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
    -moz-flex-flow: row wrap;
}

.container .item { width: 130px; height: 180px; background: red; margin: 0 1% 24px; }

I wszystko wygląda dobrze z wyjątkiem ostatniej linii / wiersza - kiedy nie zawiera takiej samej liczby elementów, że inne linie, elementy centrujące i złamały mój efekt siatki.

http://jsfiddle.net/puz219/7Hq2E/

Jak wyrównać ostatnią linię / wiersz do lewej strony?