Подскажите как на разрешении 768px сделать горизонтальный скролл блока, но что-бы контент был в несколько колонок? сейчас скролл появляется, но не скроллится.
<div class="body">
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
<div class="column">
<div class="item">ТЕКСТ</div>
</div>
</div>
.body{
display:flex;
flex-wrap:wrap;
margin: -10px;
}
.column{
flex: 0 1 auto;
padding: 10px;
}
.item{
border: 1px solid red;
}
@media (max-width: 768px) {
.body{
min-width: 1176px;
overflow:scroll;
}
}