Здравствуйте!
 
	Возможно кто-то сможет мне подсказать...
 
	Хочу сгделать вывод товаров на главной через latest.twig адаптивным  с помощью FlexBox.
 
	Врогде бы все сгделал правильно и товары выстраиваются в одну строку в зависимости от размера экрана, но как только обрамляю необходимые блоки тегами {% for product in products %} и {% endfor %}, flexbox пересиет рилиить и блоки товаров выстраиваются один под одним. Если можно, подскажите, пожалуйси, как это исправить
 
	 
 
	<div class="container">
			<div class="box">
			{% for product in products %}
			<div class="image"><a href="{{ product.href }}"><img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" /></a></div>
			<h4><a href="{{ product.href }}">{{ product.name }}</a></h4>
			<div class="price">{{ product.price }}</div>
			{% endfor %}
		</div>
	</div>
.container {
	height:auto;
	display:flex;
	flex-wrap:wrap;
	max-width:1000px;
	flex-direction:row;
	justify-content:center;
}
.box {
	flex-basis:300px;
}
.price {
	color: #000000;
}
	Вот ик  не рилииет