метод первый:
Родительский блок содержит два дочерних блока, вы можете использовать атрибут justify-content:space-between
<div class='parent'>
<div class="left"></div>
<div class="right"></div>
</div>
.parent { дисплей: флекс; flex-направление: строка; выровнять содержание:пробел между; }
Способ второй:
Сначала выровняйте дочерний блок вправо
display:flex;justify-content:flex-end;
Затем установите flex: 1 только для красного поля;
Принцип: используйте flex: 1 для динамического заполнения ширины
Способ третий:
Вы можете установить margin-right: auto для красного поля;
Принцип: после установки ширины родительского поля установка margin-right: auto автоматически займет оставшуюся полную ширину