Каковы различия между гибкой базой и шириной? ⇐ CSS

[Anonymous]

Были вопросы и статьи по этому поводу, но, насколько я могу судить, ничего убедительного. Лучшее описание, которое я смог найти:


flex-basis позволяет вам указать начальный/начальный размер элемента до того, как будет вычислено что-либо еще. Это может быть процентное или абсолютное значение.


... что само по себе мало что говорит о поведении элементов с установленным flex-basis. С моими текущими знаниями о flexbox я не понимаю, почему это не может также описать ширину.

Я хотел бы знать, чем именно flex-basis отличается от width на практике:

• Если я заменю width на flex-basis (и вице наоборот), что изменится визуально?
• Что произойдет, если я установлю для обоих разные значения? Что произойдет, если они имеют одинаковое значение?
• Есть ли особые случаи, когда использование width или flex-basis будет существенно отличаться от использования другого?
• Чем отличаются width и flex-basis при использовании в сочетании с другими стилями флексбоксов, такими как flex-wrap, flex-grow и flex-shrink?
• Есть ли другие существенные различия?

Изменить/уточнение: Этот вопрос был задан в другом формате в разделе «Какие именно наборы свойств flex-basis?» но я чувствовал, что было бы неплохо провести более прямое сравнение или обобщение различий между flex-basis и width (или height).

Подробнее здесь: https://stackoverflow.com/questions/343 ... -and-width