При разработке интерфейсов нам требуется уметь создавать элементы, которые будут связаны друг с другом. Например, иконка и текст тултипа или селектбокс и выпадающий список. При этом нам важно, чтобы связанность и видимость элементов сохранялась при изменении вьюпорта, скролла или взаимодействиях пользователя с интерфейсом.
Обычно для реализации подобного поведения нам необходимо использовать JavaScript. Однако теперь это необязательно благодаря новой фиче в CSS.
В докладе расскажу про CSS Anchor Positioning и как с его помощью упростить разработку связанных друг с другом элементов.
Доклад отличное и при этом приземлённое введение в CSS Anchor Positioning как в API. Он не просто объясняет, как работает механизм якорей, но и последовательно показывает реальные use case’ыю. За счёт живых демо и наглядных примеров хорошо видно, как решаются типовые боли — флип, переполнение, привязка к разным якорям. В итоге доклад даёт ясное понимание, зачем Anchor Positioning нужен на практике и почему это важный шаг в сторону более декларативной и предсказуемой вёрстки сложных UI-паттернов.
FrontendConf 2025