Как заказчики реагируют на flexbox?

Question

[darksladen]

Всем привет! Начал потихоньку использовать флексы, но как я понял, эта технология все же недостаточно гибкая и у нее есть ограничения.. Бывали ли у вас из за этого проблемы, когда заказчик просил вас что то подвинуть на пару пикселей и как вы с этим справлялись? Не скажешь же заказчику - это флексы, чувак, здесь так не сделаешь.. Стоит ли в таком случае вообще их применять там, где может возникнуть такая проблема?

Comments

[kulaeff]

Не вижу проблемы, чтобы подвинуть что-то на пару пикселей. Можно ведь подвинуть не flex child, а элемент внутри него. Разумеется, не стоит пихать флексы куда попало, но не всегда есть возможность заранее определить. Отмазка "это флексы, чувак, здесь так не сделаешь" не выдерживает никакой критики.

[vasIvas]

Вытаращивают глаза и начинают шипеть!

[darksladen]

kulaeff, Но тогда верстка значительно усложняется.. Если допустим я сделал авто позизиционирование с помощью space-between, а заказчик просит средний блок немного опустить или поднять.. Конечно можно сделать но кажется это ужас

[kulaeff]

darksladen, жизнь - боль.

[Hyubert]

"Ок, я это подвину, но Вам нужно доплатить, ибо я сделал по макету" - и все уже не нужно ничего двигать.

[zorca]

Не нужно свою некомпетентность сваливать на флексы. Плохому танцору любой инструмент мешает.

[darksladen]

[darksladen]

zorca, я же написал, что подвинуть можно, но насколько качественная будет верстка после этого, поддерживать ее будет сложновато, вы так не думаете?

[kulaeff]

darksladen, по вашим словам не видно всей картины. Тут ведь зависимость не только от блока, который нужно подвинуть, но и от других блоков. Я что хочу сказать, если нужно подвинуть блок, то может вообще флексы не нужны, может просто юзать position: absolute, или padding у родителя или еще какую-то комбинацию из сотен возможных?

[zorca]

darksladen, приведите конкретный пример проблемы с флексами - коммюнити выправит вам ручки и проблема будет решена раз и навсегда. Качество верстки на мой взгляд - это прежде всего целостность, масштабируемость и возможность быстрой адаптации под новые требования. А единичные проблемы с "подвинуть что-то куда-то" решаются в 100% случаев очень красивыми решениями, придуманными и реализованными раз пятьсот.

[darksladen]

zorca, ок, например такой пример - https://codepen.io/anon/pen/RLKPNX

Вот заказчик нам сказал средний текст немного опустить и кнопочку приподнять.. текст опустил, все норм, но кнопочку поднял все немного похерилось.. Это как пример, понятно что кнопку лучше абсолютом здесь сделать, но кажется таких нюансов много будет и надо будет городить костыли или все переделывать потому что заказчик что то там захотел

[zorca]

darksladen, ну начнем с того, что каждой задаче свой ответ. По-умолчанию все блоки у нас должны быть блоками. А флексы мы применяем с какой-то определенной целью. В данном случае непонятно стремление пихать их везде, где придется. Какой-то проблемы в этом примере вообще не заметил.
В вашем конкретном случае вы пытаетесь двигать блоки лейаута, а заказчик то имел ввиду текст(то бишь параграф) и кнопку. Заказчик то лучше вас знает принципы БЭМ. )))

[darksladen]

zorca, для меня проблема уже то, что эти блоки плавают и отступ идет какой то рандомный.. Если на макете там будет конкретный отступ, то придется на глаз подстраивать, что все сошлось с макетом. Если же я делал обычные отступы, я бы поставил четкий отступ от верхнего элемента. А потом дизайнер добавит 4-й блок уже с другим отступом и придется опять перестраивать все.. Вообщем много всего переходит в распоряжение браузера.

Вот допустим добавилось что то.. Как мне элемент center приподнять немного допустим? Надо его переносить будет в верхний блок и там уже делать отступы. Вообщем как не крути perfect-pixel не получится сделать на флексах.. И я уверен, что моим заказчикам это не очень понравится

Answer 1

[Yustas Alexu]

transform: translate как самый быстрый вариант. Позволяет двигать, что угодно и куда угодно.
Если время есть, то можно двигать с помощью внутренних паддингов у нужного блока. В любом случае, заказчик мыслит визуально, а не структурно. ему по фигу на ваши флексбоксы.

Comments

[bro-dev]

кол. из за таких костылей потом элементарная анимация будет криво работать. Не используйте трансформ для верстки, только для динамики.

[Yustas Alexu]

bro-dev, transform я использую в основном для центрирования фиксированных модалок по середине экрана. Если знать слабые стороны transform: translate то ничего страшного в его использовании нет.

Answer 2

[Alexandr59]

Если заказчик разбирается и знает что такое flex, то зачем ему программист?
\\\
По сути заказчику нужен результат, например сайт.
Показывает, функцию выполняет= отлично

Answer 3

[Mikhail Derkach]

Мне обычно хватало размещения штатными средствами флексбокса. Но, если уж сильно хочется, то и флексы можно двигать

Answer 4

[zooks]

Да все нормально с Flex. Просто нужно внимательно протестировать страницы на Safari и Edge.

Насчет пары пикселов: это тоже можно сделать. Но скорее всего не нужно, т.к. это часто означает, что макет сделан не точно по сетке.