Как выровнять внешний блок по самый крайний элемент во flex контейнере?

Question

[Артём Новолодский]

Можно ли выровнять красный блок по правую границу самого правого элемента во flex контейнере?

Comments

[Ankhena]

на изображении в вопросе элементы в контейнере прижаты к левому краю и имеют фиксированную ширину. Если не помещаются в одну строку, то переносятся на новую строку.

Можно на JS

[Артём Новолодский]

Ankhena, ну на JS у меня тоже вопросы возникают. Как определить самый правый элемент во flex (а можно и не flex) контейнере, после которого был перенос на новую строку?

Приходит на ум только одно. Высчитывать отступ красного блока исходя из ширины контейнера и ширины элемента (она фиксированная). Можно посчитать, сколько в одну строку влезет элементов.

[Ankhena]

Артём Новолодский, именно так

Answer 1

[Артём Новолодский]

Нативно, никак.

Answer 2

[dicem]

Не совсем понял? Это имеется ввиду?

Comments

[Артём Новолодский]

нужно вот так



а сейчас вот так

[dicem]

[Артём Новолодский]

dicem,

[dicem]

Артём Новолодский, да хоть так

[Артём Новолодский]

dicem, нет, это не решение. Это я показываю какие должны быть начальные условия)

Answer 3

[Александр]

За основу взял решение из ответа выше:

Comments

[Артём Новолодский]

элементы в контейнере должны быть фиксированного размера.

[Александр]

Артём Новолодский, ну так задайте им любой размер, суть от этого не поменяется. justify-content: space-between выравнивает элементы по краям контейнера в любом случае

[Артём Новолодский]

Александр, поменяется, это ключевой момент.

[Александр]

[Артём Новолодский]

Александр, на изображении в вопросе элементы в контейнере прижаты к левому краю и имеют фиксированную ширину. Если не помещаются в одну строку, то переносятся на новую строку.