Расположение элементов в флекс контейнере?

Question

[Tupic123]

Есть флекс контейнер:

#cssmenu__footer > ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    background: #4f4f4f;
    list-style: none;
    font-family: Roboto;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 21px;
    color: #FFFFFF;
    padding-bottom: 10px;
}

Сам контейнер
Как сделать ограничение в 7 столбиков, чтобы они растягивались на всю ширину контейнера (как сейчас на скрине)
Дальнейшие столбики переносились в новую строчку и шли по порядку, а не расходились по сторонам?

Без jusctify-content: space-between элементы не на всю ширину контейнера и не ровно друг под другом(

Comments

[Ankhena]

Если вы зададите им одинаковую ширину и отступы, то они будут ровно друг под другом.

А вообще гриды.

[Tupic123]

Ankhena, Дисплэй грид и каждый li это колонка на 14% ?

[Ankhena]

Tupic123, проще 1fr, а браузер сам посчитает сколько это.

[Антон Вебсайтовский]

Подели на три блока все, задай каждому 33.333333%

[Tupic123]

Ankhena, А если нужно именно 7 элементов в строку?

[Ankhena]

Tupic123,

А если нужно именно 7 элементов в строку?

Ну так и напишите, что 7
repeat(7, 1fr)
и отступы через grid-gap.