Посмотрел решения других, наткнулся на проблемы с формулами. Те, кто разобрался - пожалуйста, проверьте моё понимание по формулам:
-
Для растягивания (flex-grow):
У нас есть следующие данные: Ширина контейнера (ШК) = 300px и 3 элемента по 25px каждый.
По формуле найдем свободное место: СМ=300-25*3=225px.
Итоговые размеры, предположим, как 50/100/150. Получим для итоговых формулы:
50=25+аx → 25=ax
100=25+ay → 75=ay
150=25+az → 125=az
Коэффициент a - это доля свободного места. В данном случае я брал наибольшее число, на которое делятся все ak. Т.е. a = НОД(25, 75, 125) = 25. (Либо через выражения друг друга, как в примере со сжатием)
Отсюда: x = 1, y = 3, z = 5. Проверим по формуле:
Доля свободного места (ДСМ) = СМ / Сумм(flex-grow) → 25 = 225/(1+3+5)→25=225/9→25=25.
Т.е. всё сошлось -
Для сжатия (flex-shrink):
Вычислим отрицательное пространство (ОП) = 300 - (200 + 400 + 200) = -500px (далее, как я понял, используем значение без знака).
Итоговые размеры предполагаем аналогичными, но в обратном порядке (150/100/50).
Из формулы ИР=БР-(ОП * НКС) выходит:
200 - (500a) = 150 → 50 = 500a → a = 0.1
400 - (500b) = 100 → 300 = 500b → b = 0.6
200 - (500c) = 50 → 150 = 500c → c = 0.3
Далее повоюем с нормированным коэффициентом сжатия:
НКС = (БР * flex-shirk)/СПБР:
0.1 = 200x/w → 200x = 0.1w → 2000x = w
0.6 = 400y/w → 400y = 0.6w → 4000y=6w → 2000y = 3w
0.3 = 200z/w → 200z = 0.3w → 2000z=3w
Заметим, что 2000y = 3w = 2000z → y = z.
Пробуем найти коэф. для x:
2000y = 3*(2000x) → 2y = 6x → y = 3x.
Возьмем x = 1, тогда получим y = 3, z = 3
Отсюда СПБР = 2000*1 = 2000. Проверим соответствие по формуле СПБР = СУММ(БР * flex-shrink):
2000 = (200 * 1 + 400 * 3 + 200 * 3) → 2000 = (200 + 1200 + 600) → 2000 = 2000
Т.е все сошлось.
Надеюсь, все вышеописанное - истина и кому-либо это поможет…