xenonhammer

для блока со списком:

display: flex;
flex-direction: column;

для блока в котором лежит список и зеленый блок

display: flex;
align-items: center;
@media (max-width: 575px) {
flex-direction: row-revers;
}

Интересно, откуда появляется такие мнения? Нет, профессиональные верстальщики не пользуются ни сетками, ни вообще фреймворками, потому что ТРУверстальщики обязаны сами себе писать фреймворки и библиотеки, иначе засмеют и уволят)))))

Иногда дизайн макета изначально сделан дизайнером под бутстрап (и не только сетка, а вообще дизайн), в этом случае никто в своем уме не будет гарадить гриды и флексы. Ты же когда хлеб хочешь покушать, не печешь его, а идешь в магазин. Фреймворки нужны чтобы жизнь стала проще. Иногда, никто не будет подключать бутстрап из-за того что контролируют производительность, но это уже команды и среде-крупные проекты, а такие вещи узкоспециализированы и функционалы бутстрапа им просто не нужны, и они экономя каждый килобайт пилят свой идеальный продукт.