Веб-страница
22.2K subscribers
2.15K photos
559 videos
2 files
4.43K links
Всё по фронтенду, бэкенду и девопсу в одном месте

Разместить рекламу: @tproger_sales_bot

Правила общения: https://tprg.ru/rules

Другие каналы: @tproger_channels

Сайт: https://tprg.ru/site

Регистрация в перечне РКН: https://tprg.ru/64ai
Download Telegram
focusgroup предлагает отдать стрелочную навигацию браузеру

В toolbar обычно нужен один вход по Tab, а между кнопками — переход стрелками. Сейчас ради этого пишут roving tabindex: следят за фокусом и меняют tabindex. Предложение focusgroup переносит эту механику в платформу.

В официальном RFC достаточно focusgroup="toolbar", чтобы браузер управлял перемещением фокуса. Переключение pressed state, открытие меню и выполнение команд остаются задачей приложения. Автоматический фокус не реализует поведение кнопок за вас.

Пока это эксперимент: для локальной проверки RFC предлагает флаг Experimental Web Platform Features в Chromium, а API может измениться. Сара Суэйдан включила его в пожелания к Interop 2027. Это аргумент в пользу развития примитива, а не обещание стабильной поддержки во всех браузерах.

📎 Демо и описание предложения
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥3
text-box-trim убирает лишнее место у краёв текста

У двух шрифтов с одинаковым размером разные метрики, поэтому подпись может визуально «плавать» внутри кнопки. Отрицательный margin под один шрифт исправляет картинку, пока шрифт не сменился.

text-box-trim задаёт, какие края текстового блока подрезать: верхний, нижний или оба. А text-box-edge выбирает метрики, например высоту прописных букв и baseline. На примере MDN границы показывают разницу между trim-end и trim-both.

Это не ограничение числа строк и не изменение интервала между всеми строками. Работа идёт с внешними краями текста. MDN отмечает Baseline 2026 с августа, но старые браузеры ещё нужно учитывать. Проверьте результат со сменой шрифта, диакритикой и другими письменностями.

📎 Примеры text-box-trim
Please open Telegram to view this post
VIEW IN TELEGRAM
👍6🔥1