Как у вас всё сложно, господа..
Не хотел, конечно, flex тянуть, но чтобы не мучиться с пробелами между inline-блоками, пришлось.. https://jsfiddle.net/DTX_/bLbc377j/
А что там сложного? У инпутов просто есть боковые маргины пару пиксей вроде. Тебе надо сделать у всех элементов одинаковый маргин и все будет замечательно.
Как раз с флексами сложней. Отступ у inline-block гарантировано убирается через margin-left: -0.25em, потом это же значение докидываешь в padding родителя. Всего лишь работа с границами) По количеству кода у меня меньше строк)
Сергей: честно говоря, даже не совсем понимаю, что у вас там происходит на фиддле. но обязательно посмотрю и подумаю. это решение пока еще ни разу не подводило)
Sergey Goryachev: Да я вам и так скажу. Самому лень формулировать, приведу цитату с одного популярного ресурса:
Одна из главных вещей, которые вы должны знать, это то, что inline-block — является по сути обычной буквой — символом, т.е. весь наш строчный блок составляет всего лишь одну букву в строке, одну единицу. [...] Ну и соответственно, если рядом с inline-block не будет пробелов, то расстояние между ним и соседними буквами будет обычный межбуквенный интервал (трекинг), которым можно управлять (кернинг). Если есть пробелы — до соседней буквы будет этот же интервал плюс ширина пробела.
Ширина пробела и межбуквенный интервал! Это шрифто-зависимые величины. Да, на определенных шрифтах ваше так называемое magic number (-0.25em) будет работать. Но если вы поменяете шрифт, или letter-spacing, или еще что-то в шрифте, вся верстка развалится.
Не используйте "магические числа" в css. Используйте более надежные методы.
ЗЫ. Ну ладно. Верстка может быть и не развалится. Но определенные риски присутствуют, это ненадежно, непонятно сходу, для каждого шрифта нужно подбирать своё магическое число и результат может отличаться в разных браузерах, по разному рендерящих шрифты. В общем, это самый наихудший способ избавиться от промежутков между строчными блоками.
Алексей Струков: сложности возникают из-за пробелов между inline-элементами..
Потом возникают странные разметки типа
.wrapper padding: 0 5px 5px 10px;
.element margin: 5px 5px 0 -0.25em;
Про 0.25 уже сказали. Чтобы сделать границу в 1px надо ещё повозиться. А на флексе будет просто
.wrapper padding: 0px 1px 1px 0px;
.element margin: 1px 0px 0px 1px;
DirecTwiX: не будет. Там вертикальные маргины суммируются. Хотя во флексе вроде поведение margin collapse немного другое, но в данном случае должно работать
DirecTwiX: там есть еще один вариант. Крестик выносить это правильно конечно. Вот вариант с добавленным паддингом и небольшой эффект на текст в виде text-overflow - https://jsfiddle.net/qxw3ju3L/
Алексей Струков: рабочих примеров я уже насмотрелся много( у меня больше проблема, чтобы подружить желаемые плагины с joomla, и чтобы все работало. По отдельности могу запустить, а общим таском никак)))
Алексей Струков: А вообще пришли, может проще привыкнуть к чужой настройке, чем еще месяц просидеть над своим. Пути для джумлы я перепишу это не проблема.
Алексей Струков: Хотя если там нет browserSync, то мне это сильно осложнит жизнь, к нему я уже привык) Я уже проект на Фрилансим кинул, может кто-то поможет настроить по моим требованиям) Да на вопросы поотвечает)))
Sergey Goryachev: Я к сожалению не силен в Галпе. Настроил его себе давно и забыл как страшный сон. Не сторонник я всех этих консольных сборщиков, но пришлось сделать, хотя и не пользуюсь особо, ибо программирование у меня просто хобби а не работа.
Sergey Goryachev: ну там не сложно, просто много противоречивой информации и копаться в ней лень. Надо писать код. Все остальное только отвлекает. Незнаю откуда эта мода пошла сейчас разбираться во всех новых технологиях, и ставить себе все плагины, до которых руки могут дотянуться.
Алексей Струков: в целом, посмотрел файлик, ничего сложного оказалось. пути переписал. но одного плагина нет. хотя это я наверно сделаю. мне еще нужен плагин, который js будет в кучу собирать. а еще из вашего файлика узнал, что я в принципе делал многое неправильно...
Sergey Goryachev: там у меня есть таск для сборки js. Посмотри название этого пакета и скачай. Вроде работает он нормально, либо если какой другой нравится то замени на свой)
Алексей Струков: скачал, попробовал, но он собирает "в кучу", а мне критично, чтобы jquery Был первый. а некоторые вообще не нужны. наверно это настроить можно, попробую почитать доки)
Sergey Goryachev: jquery у вас локально находится на диске? Поидее там можно задать порядок в котором он будет обьединять файлы. В описании к плагину скорее всего это есть.
Алексей Струков: угу, не использую я CDN, да кроме jQuery много чего нужно выводить раньше main. Плагины тоже до объявления нужно вызывать. Почитаю. Спасибо еще раз. Быть может это и правда сократит время изучения всяких страшностей))))
