какое счастье наткнуться на ваш канал! скачала какой-то дизайн попрактиковаться в верстке, а там все задизайнили - все чек-боксы, все селекты... где бы ни искала ответ везде очень сложно и страшно. у вас прекрасный канал, спасибо за это видео!
Вадим, спасибо вам огромное! Я искренне надеюсь, что вы не пропадёте с просторов ютуба. Я видел ваши семинары (смотреть одно удовольствие). Вы замечательно доносите информацию и вообще приятно смотреть ваши видео. Это очень интересно и крайне полезно. Вы делаете большое дело. Не останавливайтесь! Спасибо!!!
Когда то, видел твое интервью на LoftBlog, и мне понравилось! Сегодня youtube показал это видео на главной странице, сразу кликнул по твоему лицу. Прошу, никогда не прячься за заставками и продолжай в том же духе.
Вадим, спасибо большое за ваши полезные и очень продуктивные ролики. Я обучаюсь на Frontend dev. и параллельно захожу на ваш канал, узнаю очень много интересного. Вы профессионал своего дела и идейный человек.👍
наконец-то в ютубе появилась годнота. Вадим благодарю за Ваш труд. Просматривая видео чувствую себя отдыхающим на мальдивах, на которые хочу заработать ))) Все толково. Спасибо!
А у меня есть замечание! Но сначала я хочу поблагодарить за этот урок и уроки, которые ты проводишь в html-academy - я как раз готовлю проект к защите на первом курсе, и взял эту реализацию для создания кастомных чекбоксов на проекте. Вначале вскользь упоминается, что input + span завёрнуты внутрь label, просто потому что так субъективно удобнее нежели прописывать for/id. На деле же, без этой вложенности данный чекбокс не будет срабатывать при наведении и клике указателя мышки на span, который не имеет привязки к label. С наставником уже думали применять другую реализацию, пока я не подумал чисто ради эксперимента всё это дело внутрь label вложить! - т.е. это важный момент, на который нужно было сделать акцент! Спасибо и нужно больше таких уроков! :)
Побольше таких, практических выпусков, как раз снова стоит задача с версткой в которой чекбоксы, последние разы делал неправильно. Теперь исправлю. Спасибо, Вадим!
Спасибо огромное за видео! Делаю обычно без изображений, svg и т.д., всё сам в css, например: галочки с помощью псевдоэлементов - привык делать вручную, а разнообразные виды отметок в шаблонах, обычно, редко встречаю
На 20-й минуте только и думала о том, что опустила бы чекбоксы ещё чууууть-чуть пониже)) А вообще спасибо, видео интересное и полезное, а футболка - просто блеск!
Итак, Вадим, большое спасибо за выпуск! Я очень рад узнать, как именно ПРАВИЛЬНО делать вёрстку checkbox'ов. Ну и, по аналогии, других элементов, которые с этим связаны (radio, например). Хотя, конечно, есть некоторые моменты, которые вызывают вопросы. А некоторые, которые так и хочется также доработать. Итак, начну с вопросов. Первый вопрос - почему следует придерживаться логике отображения через "position: absolute"? Я, например, стараюсь всячески избегать использование "position: absolute", если имеется альтернатива. В этом случае она есть. Можно использовать размеры самого блока + margin'ы от него. И при этом не нужно будет делать отступы в label'а и блока в absolute контексте. Второй вопрос по поводу сокрытия элементов. Есть такой универсальный класс по сокрытию "visually-hidden". Однако, я неоднократно видел, казалось бы, простую реализацию с "position: absolute; top: -9999px; left: -9999px;". Было бы здорово, если б вы объяснили, в чём минусы подобной конструкции для сокрытия элемента. Так, а теперь по поводу предложений доработки. Меня часто напрягает использование инлайновой svg-шки внутри css. Порой кажется, что этого там быть не должно. Поэтому в проектах я стараюсь всячески избегать подобного. Я понимаю, что подгрузка css будет тянуть с собой и картинку, и по скорости это выиграет. Но есть другие варианты. Например, использование в разметке svg-шки. Конечно, в той реализации, что показана в видео, получается, что они, эти svg-шки, слишком много занимают места. Однако, можно же сделать svg-спрайт. И если вариант с подгрузкой изображения извне вас не устроит, вполне можно этот спрайт встроить на страницу. Тогда обращаться к элементам будет проще и занимать места они будут меньше в самой вёрстке. Посмотрев это видео, я понял, что лучше чаще обращать внимание на все состояния и каждое описывать. Второе, что важно, это использование встроенных в браузер возможностей input'а. Когда делается кастомный input, забывается о том, что люди используют клавиатуру, скринридеры и прочее. А об этом нужно помнить!
1. Position: absolute удобно использовать, когда объект больше высоты строки или потенциально может стать больше неё. Объект больше не мешает тексту. Это мой взгляд и мой опыт, у вас может быть другой.
2. Позиционирование, которое уносит блоки за пределы экрана - это старинный способ, который показал свою неэффективность: может появиться прокрутка, скринридеры могут не воспринять блоки за пределами вьюпорта и так далее. Типичный класс .visually-hidden лишён этих недостатков и проверен в современных условиях.
Делается всё всегда легко. Ну или сравнительно легко. А поддерживается CSS-графика почти всегда очень сложно: она ломается в разных браузерах, на разных платформах, при увеличении или уменьшении масштаба. А если галочке нужно скруглить или как-то иначе повернуть палочки - нужно вызывать рисовальщика на CSS. Или вот ещё: три иконки в проекте делаются на CSS влёт, а ещё две ну вообще никак, чересчур сложно. И что, сделаем три так, а две иначе?
Тэкс, про то, что лучше бы не вырывать из потока - в комментах сказали (inline-block или inline-flex в зависимости от сложности кастомного чекбокса, чтобы снаружи он был инлайновым и максимально повторял поведение нативного), про :hover и :active тоже сказали (я за то, чтобы всегда все состояния настраивать)). Но! Никто! Вот вообще никто в комментах не сказал про `indeterminate`! Вадим, ну как так-то?) Если уж люди будут учиться делать чекбоксы, то лучше уж, чтобы они сразу про все варианты знали, а не впадали в ступор перед "чёрточкой в коробочке", когда в ней возникнет необходимость) Спасибо за видео)
Как только вы начинаете думать про доступность интерфейсов с клавиатуры, вы замечаете, что visibility: hidden прячет контролы так, что на них уже не попасть. У opacity есть проблемы со скринридерами - они могут потерять контролы, которые не отображаются на экране или имеют нулевые размеры.
Ох дружище, у меня был похожий код, но тут возникла необходимость поставить несколько чекбоксов на страницу, оказалось что работает только первый. Сделал по твоему способу, все отлично получилось, только я стилизовал чуть по дргому, вместо картинок стили, вместо галочки, афтер с прозрачность 0, и при чеке, опасити меняется на 1. Этот способ можно использовать если у вас растровая графика.
Все круто! Только у чекбоксов есть еще состояние - "неопределенный" (indeterminate). И галочки в простом случае можно сделать через наклоненные в 45deg before/after псевдо-элементы. Тогда вообще без svg можно обойтись
Неопределённые состояния можно было бы добавить, но я в реальности их не встречал ни разу. Плюс в дизайне их не было. Ну а рисование на CSS работает редко и плохо: чуть угол другой или нужно нарисовать что-то сложнее крестика или галочки - выбрасываем фантазии и делаем нормально. Так что я предпочитаю сразу делать нормально.
Вадим, спасибо за работу, очень полезные видео и информативные, как наткнулся на ваш канал месяц назад все видео в тот же день пересмотрел, спасибо ^_^
Мне пока не очень актуально, т.к на плюсах пишу, но после просмотра захотел нажать "подписаться", а смотрю - уже подписан 🙈 Подписался после видео про nginx
Хочется выразить благодарность автору за видео. Очень интересно и познавательно. Думаю буду смотреть Ваши видео. Кроме этого успел посмотреть Переключатель 🌓 цветовой схемы. Видео просто супер. P.S. Очень хочется увидеть подобный материал по кастомизации select. Делаю свою библиотеку компонентов и не знаю как кастомизировать нативный select.
Спасибо за такой материал! Мне, как новичку, это было ну просто очень полезно. Возвращайтесь на эту площадку. Думаю, многие этого хотят! P.s. футболка крутецкая 🙃
Божечки, он снова в строю🙌 Хотим больше видосиков. Спасибо огромное, Вадим, что уделяешь этому свое драгоценное время. Потому что настолько круто рассказано и со всех сторон рассмотрено, что ловишь счастье✔
Отличное видео, практически материал, который можно использовать прямо сейчас! Было бы любопытно увидеть выпуски по использованию более редких css свойств. К примеру никогда не использовал clip(). Хотелось бы понять, для каких именно ситуаций они добавлены. Сделал подписку на патрионе, продолжайте развивать свои проекты, вы большие молодцы! Спасибо!
Свойством clip лучше активно не пользоваться, если можете. Оно выброшено из спецификаций и остаётся в браузерах для совместимости. Но идею понял, может расскажу о редких интересных свойствах.
Для такого простого дизайна лучше вообще без svg обойтись. Тогда и инлайнить ничего не придётся. Или сделать картинкой только галочку. А так классный способ. Я раньше label после чекбоксов ставил и в стилях + писал, но так действительно удобнее, спасибо)
какое счастье наткнуться на ваш канал! скачала какой-то дизайн попрактиковаться в верстке, а там все задизайнили - все чек-боксы, все селекты... где бы ни искала ответ везде очень сложно и страшно. у вас прекрасный канал, спасибо за это видео!
Единственный волг, который я смотрю на первой скорости.)))
Как же я не видел эти видео! Даже я все понял и с css и Linux.
Обязательно пересмотрю все ролики и попрактикуюсь.
Автору мегареспект!!!
Вадим, спасибо вам огромное! Я искренне надеюсь, что вы не пропадёте с просторов ютуба. Я видел ваши семинары (смотреть одно удовольствие). Вы замечательно доносите информацию и вообще приятно смотреть ваши видео. Это очень интересно и крайне полезно. Вы делаете большое дело. Не останавливайтесь! Спасибо!!!
Скучаю по таким полезняшкам.. Вадим, возвращайся на UA-cam! :)
Не то, чтобы я нуждался или нет в такой информации, но футболки Вадима никогда не подводили. Шикарные, как всегда. И футболка и материал :)
вы чудесный
подача, материал все прекрасно
я в начале пути изучения, и так рада что мне порекомендовали ваш канал
Когда то, видел твое интервью на LoftBlog, и мне понравилось! Сегодня youtube показал это видео на главной странице, сразу кликнул по твоему лицу. Прошу, никогда не прячься за заставками и продолжай в том же духе.
Ничего лишнего, доступно и хочеться досмотреть до конца! Подписалась)) 🔔
Вадим, спасибо большое за ваши полезные и очень продуктивные ролики. Я обучаюсь на Frontend dev. и параллельно захожу на ваш канал, узнаю очень много интересного. Вы профессионал своего дела и идейный человек.👍
Это было круто! Вы столько всего знаете, офигеть просто, поняла всю необъятность адаптивности!)
Как же я по вам соскучилась☺️
Только что заверстал форму с кастомными чекбоксами прям повторяя за Вадимом, быстро, просто и красиво . Огонь!
Приятно слушать грамотного специалиста!
Спасибо! Всегда прятал checkbox через display: none; и думал что это правильно. Мотивируете писать код правильно.
наконец-то в ютубе появилась годнота. Вадим благодарю за Ваш труд. Просматривая видео чувствую себя отдыхающим на мальдивах, на которые хочу заработать ))) Все толково. Спасибо!
Как же ты круто все объясняешь! Лайк!
то чувство, когда 3 года страдал от болезни копипаста стилей чекбокса|радио с кодпена, но пришел к доктору и вылечился за один сеанс)
А у меня есть замечание! Но сначала я хочу поблагодарить за этот урок и уроки, которые ты проводишь в html-academy - я как раз готовлю проект к защите на первом курсе, и взял эту реализацию для создания кастомных чекбоксов на проекте. Вначале вскользь упоминается, что input + span завёрнуты внутрь label, просто потому что так субъективно удобнее нежели прописывать for/id. На деле же, без этой вложенности данный чекбокс не будет срабатывать при наведении и клике указателя мышки на span, который не имеет привязки к label. С наставником уже думали применять другую реализацию, пока я не подумал чисто ради эксперимента всё это дело внутрь label вложить! - т.е. это важный момент, на который нужно было сделать акцент! Спасибо и нужно больше таких уроков! :)
Побольше таких, практических выпусков, как раз снова стоит задача с версткой в которой чекбоксы, последние разы делал неправильно. Теперь исправлю. Спасибо, Вадим!
Спасибо огромное за видео! Делаю обычно без изображений, svg и т.д., всё сам в css, например: галочки с помощью псевдоэлементов - привык делать вручную, а разнообразные виды отметок в шаблонах, обычно, редко встречаю
всегда радуюсь таким видяшкам - по делу, но и подробно там где надо. Спасибо! хочется больше такого контента
Ни знал что такое можно в css сделать. Класс! Магия какая-то!
Спасибо большое. Очень интересно!!!
Это самые основы основ, какая магия )
На 20-й минуте только и думала о том, что опустила бы чекбоксы ещё чууууть-чуть пониже))
А вообще спасибо, видео интересное и полезное, а футболка - просто блеск!
Да, там можно ещё поиграть ;) Но я решил уже не гоняться за мелочами.
Лайк как минимум за вложенный инпут в лейбл, всегда задаюсь вопросом зачем айди + фор(лишний код) :)
Большое ЧЕЛОВЕЧЕСКОЕ - СПАСИБО!!!
Так легко смотреть и все понятно. Не жалко и пол часа. Спасибо, Вадим! Ждём ещё что-то новое)
Вадим, отличный контент для любого уровня,нужно больше подобного)
Наконец-то!
С возвращением, Вадим!
Как всегда, очень просто и (самое главное) практично. :)
Хорошее начало дня: чашка кофе и видео-разбор Вадима Макеева... Вадим, не останавливайтесь :)
Спасибо! Ёмко, понятно и никакой воды.
Очень здорово. У Вас хорошо получается объяснять.
Вадим как всегда великолепен! Спасибо.
супер подробно и понятно, очень благодарен!
Как всегда мега полезно! Такого контента не найти на просторах ютуба. Спасибо!
Очень доходчиво, очень приятный спикер, спасибо)
Вадим, вы классный преподаватель, всё очень понятно и просто оказалось. большое спасибо😉💌
Это самый лучший ролик на Ютубе про чекбоксы
Как же все четко и по сути) нравится)продолжайте!
Вадим, большое спасибо! Как всегда: понятно, полезно, доступно и познавательно! Ждем новых видео!
Итак, Вадим, большое спасибо за выпуск! Я очень рад узнать, как именно ПРАВИЛЬНО делать вёрстку checkbox'ов. Ну и, по аналогии, других элементов, которые с этим связаны (radio, например).
Хотя, конечно, есть некоторые моменты, которые вызывают вопросы. А некоторые, которые так и хочется также доработать.
Итак, начну с вопросов. Первый вопрос - почему следует придерживаться логике отображения через "position: absolute"? Я, например, стараюсь всячески избегать использование "position: absolute", если имеется альтернатива. В этом случае она есть. Можно использовать размеры самого блока + margin'ы от него. И при этом не нужно будет делать отступы в label'а и блока в absolute контексте.
Второй вопрос по поводу сокрытия элементов. Есть такой универсальный класс по сокрытию "visually-hidden". Однако, я неоднократно видел, казалось бы, простую реализацию с "position: absolute; top: -9999px; left: -9999px;". Было бы здорово, если б вы объяснили, в чём минусы подобной конструкции для сокрытия элемента.
Так, а теперь по поводу предложений доработки. Меня часто напрягает использование инлайновой svg-шки внутри css. Порой кажется, что этого там быть не должно. Поэтому в проектах я стараюсь всячески избегать подобного. Я понимаю, что подгрузка css будет тянуть с собой и картинку, и по скорости это выиграет. Но есть другие варианты. Например, использование в разметке svg-шки. Конечно, в той реализации, что показана в видео, получается, что они, эти svg-шки, слишком много занимают места. Однако, можно же сделать svg-спрайт. И если вариант с подгрузкой изображения извне вас не устроит, вполне можно этот спрайт встроить на страницу. Тогда обращаться к элементам будет проще и занимать места они будут меньше в самой вёрстке.
Посмотрев это видео, я понял, что лучше чаще обращать внимание на все состояния и каждое описывать. Второе, что важно, это использование встроенных в браузер возможностей input'а. Когда делается кастомный input, забывается о том, что люди используют клавиатуру, скринридеры и прочее. А об этом нужно помнить!
1. Position: absolute удобно использовать, когда объект больше высоты строки или потенциально может стать больше неё. Объект больше не мешает тексту. Это мой взгляд и мой опыт, у вас может быть другой.
2. Позиционирование, которое уносит блоки за пределы экрана - это старинный способ, который показал свою неэффективность: может появиться прокрутка, скринридеры могут не воспринять блоки за пределами вьюпорта и так далее. Типичный класс .visually-hidden лишён этих недостатков и проверен в современных условиях.
3. Я показал много вариантов вставки графики - выбирайте тот, который вам подходит больше. Я не настаиваю ни на каком из них :)
@@pepelsbey Хорошо, Вадим, спасибо большое за ответы на вопросы!)
Всегда прописывал id для связей...а можно проще. Вадим, спасибо!
ПРОСТО СУПЕР ПОЛЕЗНЫЕ ПОЗНАВАТЕЛЬНЫЕ УРОКИ, ХОТЕЛ БЫ Я ЛИЧНО С ВАМИ ПОЗНАКОМИТЬСЯ)))
Ага, я тоже хочу с Вадимом познакомиться)) Сейчас стану супер-пупер фронтендером и пойду знакомиться))
Жаль что нельзя лайкнуть дважды. Круто все рассказал и очень помог. Спасибо!
Прям класс, огромная благодарность за такие информативные ы подробные видео
Спасибо огромное за подробный мануал! Всё разложено по полкам, картина с чекбоксами прояснилась :) Больше не буду хаотично копипастить :)
Вадим, спасибо большое. Очень для меня видео, как раз дизайнеры на работе стали увлекается чекбоксами и их стилизацией.
Теперь я представляю Вас, когда слушаю ваши подкасты!
Да действительно это очень полезно как новичкам так и опытным верстальщикам. Спасибо за видео Вадим отлично обьясняете!
Первое видео которое посмотрел на канале и, блин, очень круто, очень круто объясняет человек. С удовольствием подписался и посмотрю другие видео.
Футболка очень! И за выпуск, Вадим, спасибо! Всегда очень емко и по делу.
This channel has very important knowledge about frontend. Thanks you for job)
Удивительно понятная и приятная подача, спасибо за ваши видео!
Круто, вроде бы простые вещи, но каждый раз что-то новое. спасибо.
Смотреть одно удовольствие. Спасибо!
Отличный пример с использованием SVG и чистом CSS!
Макеев просто лучший. Лайк однозначно!
Вадим, с возвращением! Как всегда ёмко и по делу. Спасибо!
Спасибо за познавательное видео 👍🏻 и с возвращением 👋
Вот прям идеально подана информация.
Классное видео, подача Агонь
Шикарно объясняете. Очень жаль, что больше не выходят видео((
Дополню, что галочка ✓ тоже легко делается через CSS. Это по сути прямоугольник с двумя прозрачными сторонами повернутый на 45 градусов 😉
Делается всё всегда легко. Ну или сравнительно легко. А поддерживается CSS-графика почти всегда очень сложно: она ломается в разных браузерах, на разных платформах, при увеличении или уменьшении масштаба. А если галочке нужно скруглить или как-то иначе повернуть палочки - нужно вызывать рисовальщика на CSS. Или вот ещё: три иконки в проекте делаются на CSS влёт, а ещё две ну вообще никак, чересчур сложно. И что, сделаем три так, а две иначе?
Отличная подача, понадобится для сдачи ДЗ по декоративным элементам. Спасибо
Умеете, могёте 👍
Спасибо! Помогли чайнику походу понять не только про чекбоксы..
Здравствуйте! Благодарю за видео!
Тэкс, про то, что лучше бы не вырывать из потока - в комментах сказали (inline-block или inline-flex в зависимости от сложности кастомного чекбокса, чтобы снаружи он был инлайновым и максимально повторял поведение нативного), про :hover и :active тоже сказали (я за то, чтобы всегда все состояния настраивать)).
Но! Никто! Вот вообще никто в комментах не сказал про `indeterminate`! Вадим, ну как так-то?) Если уж люди будут учиться делать чекбоксы, то лучше уж, чтобы они сразу про все варианты знали, а не впадали в ступор перед "чёрточкой в коробочке", когда в ней возникнет необходимость)
Спасибо за видео)
Спасибо за подробный разбор! Хотелось бы еще услышать почему не visibility: hidden; и opacity: 0;
Как только вы начинаете думать про доступность интерфейсов с клавиатуры, вы замечаете, что visibility: hidden прячет контролы так, что на них уже не попасть. У opacity есть проблемы со скринридерами - они могут потерять контролы, которые не отображаются на экране или имеют нулевые размеры.
Ох дружище, у меня был похожий код, но тут возникла необходимость поставить несколько чекбоксов на страницу, оказалось что работает только первый. Сделал по твоему способу, все отлично получилось, только я стилизовал чуть по дргому, вместо картинок стили, вместо галочки, афтер с прозрачность 0, и при чеке, опасити меняется на 1. Этот способ можно использовать если у вас растровая графика.
Все круто! Только у чекбоксов есть еще состояние - "неопределенный" (indeterminate).
И галочки в простом случае можно сделать через наклоненные в 45deg before/after псевдо-элементы. Тогда вообще без svg можно обойтись
Неопределённые состояния можно было бы добавить, но я в реальности их не встречал ни разу. Плюс в дизайне их не было. Ну а рисование на CSS работает редко и плохо: чуть угол другой или нужно нарисовать что-то сложнее крестика или галочки - выбрасываем фантазии и делаем нормально. Так что я предпочитаю сразу делать нормально.
Вадим, спасибо за работу, очень полезные видео и информативные, как наткнулся на ваш канал месяц назад все видео в тот же день пересмотрел, спасибо ^_^
Красота. На одном дыхании
Просто божественно!!!!! Покажи, пжлст, как оформлять гребанные select & option !!!
Мне пока не очень актуально, т.к на плюсах пишу, но после просмотра захотел нажать "подписаться", а смотрю - уже подписан 🙈
Подписался после видео про nginx
Спонсирую проект, досматривая рекламу доконца. Спасибо за идеальную подачу!
Полезно, спасибо!
Это афигенно! Спасибо, Вадим 👏👏
Спасибо за видео! Обожаю управление с клавиатуры для навигации по сайтам, жаль что не везде используют такие подходы.
отлично! очень круто! просто и понятно)
Спасибо, за качественную работу!
Очень крутые видео, всегда что-то новое узнаю
Хочется выразить благодарность автору за видео.
Очень интересно и познавательно. Думаю буду смотреть Ваши видео.
Кроме этого успел посмотреть Переключатель 🌓 цветовой схемы. Видео просто супер.
P.S. Очень хочется увидеть подобный материал по кастомизации select. Делаю свою библиотеку компонентов и не знаю как кастомизировать нативный select.
Спасибо за такой материал! Мне, как новичку, это было ну просто очень полезно. Возвращайтесь на эту площадку. Думаю, многие этого хотят!
P.s. футболка крутецкая 🙃
Вадим, спасибо за видео!
Бесподобно, супер.
Спасибо большое, Вадим.
Божечки, он снова в строю🙌 Хотим больше видосиков. Спасибо огромное, Вадим, что уделяешь этому свое драгоценное время. Потому что настолько круто рассказано и со всех сторон рассмотрено, что ловишь счастье✔
Очень круто, Вадим, спасибо!
отлично, Вадим!
нужная инфа, хорошая подача, футболка норм)))
продолжай, плиззз:)
Круто! Спасибо!
Нужен разбор position, а то сложно самому полноценно разобраться :с Видео как всегда супер!
Поставил лайк, используя только клавиатуру)
Очень круто! А пробел - это перенос строки в коде перед текстом)
Отличное видео, практически материал, который можно использовать прямо сейчас! Было бы любопытно увидеть выпуски по использованию более редких css свойств. К примеру никогда не использовал clip(). Хотелось бы понять, для каких именно ситуаций они добавлены. Сделал подписку на патрионе, продолжайте развивать свои проекты, вы большие молодцы! Спасибо!
Свойством clip лучше активно не пользоваться, если можете. Оно выброшено из спецификаций и остаётся в браузерах для совместимости. Но идею понял, может расскажу о редких интересных свойствах.
восторг!
Для такого простого дизайна лучше вообще без svg обойтись. Тогда и инлайнить ничего не придётся. Или сделать картинкой только галочку.
А так классный способ. Я раньше label после чекбоксов ставил и в стилях + писал, но так действительно удобнее, спасибо)
Блин, написал коммент раньше чем видео досмотрел) Сорри, тема раскрыта)
спасибо от дизайнера)
Очень кстати оказалось видео, спасибо большое. Исправил у себя в проекте))
Вадим, спасибо вам большое!