Firefox и псевдокласс first-letter

Скрипты и советы | 17 июня 2018 1 135

Уроки CSS на Хабрахабре, habrahabr.ru, Веб-дизайн

Возникла у нас в команде необходимость в одном выпадающем списке добавить значки к элементам списка в зависимости от типа элемента. Сам список сторонний компонент, который трогать не хотелось. Значки реализованы в виде шрифта, т. е. являются символами юникода.
В качестве решения на сервере в зависимости от типа элемента добавили в качестве обычной буквы символ значка uXXXX и на клиенте получили красивые квадратики, поскольку шрифт, используемый для списка не содержит в себе коды наших иконок. Тут нам на помощь пришел CSS псевдокласс ::first-letter
Читать дальше →

Источник: Уроки CSS на Хабрахабре

[Перевод] CSS :autofill селектор

Псевдокласс :auto-fill в CSS позволяет нам стилизовать элементы , которые содержат контент, автоматически заполняемый...

Подробнее
[Перевод] Гибкие таблицы на CSS Grid

Просмотр списка лидов («холодных» контактов) Поскольку мы уже запустились, я, наконец, могу рассказать о секретном...

Подробнее
Каскадные Таблицы Стилей / Аккорды с применением высоких технологий

Задача заверстать аппликатуру весьма не тривиальна и от того довольно интересна. Я тоже не устоял перед искушением...

Подробнее
[Из песочницы] «Font-weight: bolder» для шрифтов со множеством начертаний

Если вы используете шрифт со множеством начертаний, то вам, вероятно, захочется, чтобы теги strong и b не увеличивали...

Подробнее
Огненный лис / FireScope новый девелоперский плагин для Firefox

Итак, SitePoint выпустили новый плагин, а точнее надстройку для Firebug. Плагин предоставляет более продвинутый...

Подробнее
[Перевод] Система font fallback: что происходит, когда шрифт не может найти нужный символ

Поднимите руку, если когда-нибудь сталкивались с такой ситуацией: вы получили текст со странными прямоугольниками или...

Подробнее

💬 Комментарии

В связи с новыми требованиями законодательства РФ (ФЗ-152, ФЗ «О рекламе») и ужесточением контроля со стороны РКН, мы отключили систему комментариев на сайте.

🔒 Важно Теперь мы не собираем и не храним ваши персональные данные — даже если очень захотим.

💡 Хотите обсудить материал?

Присоединяйтесь к нашему Telegram-каналу:

https://t.me/tcsecms

Нажмите кнопку ниже — и вы сразу попадёте в чат с комментариями