Comments 13
Ну, честно говоря, так себе...
Несколько изображений для бэкграунда - уже довольно старая фича. Думается мне, что с ней сталкивался любой, кто плотно работал с градиентами.
display: contents, я лично уже не меньше года использую - сильно помогает привести в соответствие мобильную и десктопную вёрстку (скрывая ненужные обертки).
Давайте тогда и pointer-events в очередной раз вспомним ;)
Delete
Узнал новое для себя, значит статья полезна.
Использовать backround для фонового изображение через css - это моветон. У нас в компании вообще это под запретом. Только тэг picture и лейзи-лоадинг, к сожалению. Да, можно использовать image-set, но функционал у него не такой богатый, да и поддержка браузеров 84 процента может не всех устроить.
Мой вам совет - бегите из этой компании))
Это же надо такую дичь придумать - для бэкграунда элемента использовать дополнительную сущность в html-разметке... Я уж молчу про семантику, но как вы это юзаете? Каждому элементу с бэкграундом - position: relative, а затем позиционированный picture?
Моветон... У меня просто нет слов))
С чем связан такой запрет? background ведь создан для фонового изображения
Как ещё может быть полезен display: contents: если вам неохота или сложно генерировать уникальные идентификаторы для пар элементов <label for="login">Login</label><input id="login" .../> , то можно же вкладывать поле внутрь метки: <label>Login <input .../></label> , но так поломается разметка сеткой, тогда вот для label можно и указать данное свойство.
Тогда ваш label потеряется для скринридера, а поле будет без имени
Ну есть что-то такое, но это не по спецификации, а баги каких-либо браузеров, когда-нибудь исправят. Можно попробовать добавить span и прописать aria- атрибуты.
Какую же всё таки хуеню спрашивают на собеседованиях 🤦♂️
Зашел в рекомендации из рассылки хабра. Увидел статью. Стас, привет. Знаю, тебе такая информация тоже важна 👍🏼
Неизвестно полезный CSS. Часть 3