Блять, ты подробнее объясни, что ты хочешь. Раскидать их по сторонам или именно колонки?

Две колонки, как на картинке, левая и правая.
Про "раскидать по сторонам ты сам придумал. Отступ там фиксированный

я про спейс битвин ни слова не говорил

Блять, я не говорил что ты так сказал, если ты пришёл в чат с вопросом, то конкретно обьясни что ты хочешь

Ибо я не въебую, что ты хочешь

Колонки сделать именно?  Да/нет, вариантов больше нет

Да, две колонки

третий раз говорю

Ибо вот этот вопрос, ну нихуя не говорит о том, что ты пишешь сейчас

flex-direction гугли

Затрудняюсь ответить на 6,это C?

вот спасибо)
Я написал об этом на втором сообщении

Как их ограничить двумя колонками?

и как заставить именно делиться на две колонки в том месте, где мне надо?
Туп подбирать родителю высоту и ширину?

Да

🤷‍♂️2,и border же может быть в 1 и в 2,или не?

flex не делится на колонки.
Он располагает блоки (сколько бы их не было) в строку или в столбец.

Чтобы объекты «делились» на колонки есть 2 варианта:
1. Делается два глобальных дива, они в одну строчку, каждый будет как «колонка», в нём уже располагаются нужные элементы.
2. Каждая строчка оборачивается в свой див и тогда элементы либо спейс-бетвин, либо флекс-старт/флекс-энд (но тогда ширины и отсупы нужно прописывать).

У меня нет возможности обернуть детей в доп дивы, так как это модульный реюзабельный компонент во vue, который я стилизую из родителя

Могу только css навесить

Пытался гридами, но там проблема а том, что в зависимости от разных кейсов, число элементов различное.
Соответственно, grid-template-areas идёт по одному месту(