Здравствуйте!
Возможно кто-то сможет мне подсказать...
Хочу сделать вывод товаров на главной через 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;
}
Вот так не работает
