Как сделать 3 колонки с помощью flex, если две крайние должны быть фиксированные?

Question

[trevoga_su]

Привет всем.
Попытался с помощью flex сделать 3 колонки.
Две крайние должны быть фиксированной ширины, центральная - 100%.
Кто-нибудь делал подобное?
Растянуть центральную колонку не получается никак.

Answer 1

[Назар Мокринский]

Задайте центральной колонке:

-ms-flex: 1 1 0.000000001px;
-webkit-flex: 1;
flex: 1;
-webkit-flex-basis: 0.000000001px;
flex-basis: 0.000000001px;

Это с учётом вендорных префиксов - она растянется на всё свободное место.

Comments

[trevoga_su]

Шаманство какое.. также, как и решение предыдущего комментатора - не работает в последнем safary под windows

[Назар Мокринский]

trevoga_su: Ясен пень, там ОГРОМНОЕ КОЛИЧЕСТВО всего не работает, потому что актуальная версия под Mac OS X 8, а под Windows 5.x , при этом она не обновляется, не поддерживается и никогда не будет. Apple не выпускает Safari под Windows и уже много лет как.
Удалите её и не морочьте тут никому голову.

[trevoga_su]

Назар Мокринский: Да, я в курсе, что не поддерживается. Вы считаете под этот браузер (5 версия) не стоит тестить? Я просто по привычке его ставлю всегда, я не верстальщик и как-то раньше не задумывался о том, насколько он актуален )

[Назар Мокринский]

trevoga_su: Не то что тестить, его даже ставить смысла нет) Он, вероятно, flex вообще не знает и не понимает, как и множество других вещей.
Не думаю, что кто-то в здравом уме ещё использует. Он намного более старый чем даже Opera 12.x, на которую никто уже не ориентируется.

[trevoga_su]

Назар Мокринский: Удалил. Спасибо, что пнули )

[Евгений Петров]

trevoga_su: Вы что, смеётесь?)
Safari for Windows — 3 года как мёртвый проект и если кто им пользуются, то только безумцы.

[trevoga_su]

Евгений Петров: да я как-то по привычке его ставил.. и тестил в нем. До сего момента. Я не верстальщик, я программист))

Сейчас у меня для тестирования стоит IE 11, последний FF, Хром, Опера. Этого достаточно? Я ничего не упустил?

[Евгений Петров]

trevoga_su: Вполне. В IE11 есть режимы эмуляции, вплоть до 7-й версии. А остальные обновляются самостоятельно.

Answer 2

[Алексей Зуев]

Так не подойдет?

Comments

[trevoga_su]

хорошее решение, но safary под windows не понимает(

[Андрей Федоров]

лол. а ничего что safary понимает flex только с 6 версии?

Answer 3

[trevoga_su]

дополню на всякий случай:решается установкой flex-grow: 1 на центральную колонку https://jsfiddle.net/n9aqg9vh/