Как на Flexbox растянуть блок, не трогая остальные фиксированные?

Question

[BarneyGumble]

Всем привет!

Имею следующую разметку:

<style>
	.container {
		display: flex;
		justify-content: space-between;
	}

	.fix {
		width: 200px;
	}
</style>

<div class="container">
	<div class="fix"></div>
	<div class="flex"></div>
	<div class="fix"></div>
</div>

Как сделать так, чтобы блоки растягивались на всю ширину .container таким образом, чтобы мои .fix-блоки сохраняли свою фиксированную ширину в 200px? Потому что сейчас все блоки растягиваются автоматически (я так понял, в зависимости от контента), и моя фиксированная ширина игнорируется

Answer 1

[Negwereth]

.container {
  display: flex;
}

.flex {
  flex: 1;
}

.fix {
  flex: 0 200px;
}

Answer 2

[Lynn «Кофеман»]

Наверное нужно всё-таки прочитать хотя бы одну статью про флексы и конкретно про свойство flex.

Тут достаточно

.fix {
  width: 200px;
  flex: none;
}

Comments

[Сергей Бурдужа]

Спасибо, вы мне помогли.