Dvě funkce, které vývojáři frontendu dlouho čekali, konečně dosáhly statusu Baseline 2026: CSS Anchor Positioning a HTML Popover API. To znamená plnou podporu ve všech moderních prohlížečích – Chrome 125+, Firefox 147+ a Safari 26. A spolu s tím přichází konec éry JavaScriptových knihoven jako Floating UI, Popper.js nebo Tippy.js pro většinu běžných případů použití.
Co je CSS Anchor Positioning?
CSS Anchor Positioning je nativní mechanismus prohlížeče, který umožňuje pozicovat elementy relativně k jiným elementům (tzv. „kotevním bodům“) deklarativně v CSS – bez jediného řádku JavaScriptu. Dříve jste pro tooltip, dropdown nebo floating label potřebovali JavaScriptovou knihovnu, která sledovala pozici elementu v DOM, počítala offsety a přepočítávala polohu při scrollování či resizování okna.
Nyní to zvládne prohlížeč sám:
.anchor { anchor-name: --my-anchor; }
.tooltip {
position: absolute;
position-anchor: --my-anchor;
bottom: calc(anchor(top) + 8px);
left: anchor(center);
}Co přináší HTML Popover API?
Popover API řeší druhou polovinu téhož problému – zobrazování a skrývání plovoucích vrstev. Dříve jste k tomu potřebovali JavaScript: event listenery, správu z-indexu, zavírání na Escape nebo kliknutí mimo element, renderování do správné vrstvy stránky. Nyní stačí HTML atributy:
<button popovertarget="muj-tooltip">Najeďte sem</button>
<div id="muj-tooltip" popover>Obsah tooltipu</div>Prohlížeč automaticky zajistí: správnou vrstvu renderování (top layer), zavření na Escape, light-dismiss (kliknutí mimo), správné zacházení s focus managementem a přístupnost.
Proč je Baseline 2026 důležitý milník?
Dosažení statusu Baseline 2026 znamená, že obě funkce jsou implementovány a stabilní ve všech hlavních prohlížečích. Pro vývojáře to prakticky znamená: můžete je používat v produkci bez fallbacků. Již nepotřebujete @supports kontroly ani polyfilly pro tyto specifické funkce.
Co to znamená pro vaše projekty?
Pro nové projekty v roce 2026 neexistuje důvod sáhnout po JavaScriptové knihovně pro pozicování jako první krok. Kombinace CSS Anchor Positioning a Popover API řeší naprostou většinu případů použití, pro které se dříve instalovaly Floating UI nebo Popper.js. Prohlížeč to zvládne rychleji, s méně kódem a s lepší výchozí přístupností.
JavaScript pro pozicování stále dává smysl v hraničních případech: hluboce vnořené menu s obsahem načítaným on-demand, tooltipy uvnitř Shadow DOM s cross-origin omezeními nebo virtualizované listy kde kotevní element nemusí být v DOM. Ale tyto případy tvoří zlomek typické potřeby po Floating UI instalacích.
Praktické tipy pro migraci
Pokud aktualizujete existující projekt, doporučujeme postupný přístup: identifikujte tooltipy a dropdowny, které nepotřebují on-demand načítání obsahu, a migrujte je jako první. Měřte výsledky – méně JavaScriptu zpravidla znamená rychlejší Time to Interactive a menší bundle size.
Závěr
CSS Anchor Positioning a Popover API jsou příkladem toho, jak webová platforma dozrává a bere práci zpět od JavaScriptových knihoven. Dosažení Baseline 2026 je jasný signál: pokud ještě nepracujete s těmito funkcemi, začněte dnes. Vaše budoucí já (a vaši uživatelé) vám poděkují za rychlejší, lehčí weby.
