Подскажите, пожалуйста, как реализовать это посредством css flexbox. Оба блока max-width: 30em. Очень желательно с минимумом кода.
.parent {
display: flex;
flex-wrap: wrap;
}
.parent li {
flex: 1 1 320px;
max-width: 30em;
}
.parent > li {
flex-direction: column-reverse;
}
<ul class="parent">
<li>Column One</li>
<li>Column Two</li>
</ul>
Вот так не работает. Суть в том, чтобы блок A на десктопе был слева, а на мобильном снизу.
flex-wrap: wrap
и всё