Assist the Anchoreum with their new museum exhibit! There are dozens of anchors on display that need labels. Mount them using CSS anchor, a new module that allows you to position and size one element relative to any other element on the page. When the anchor moves, the element remains tethered to it, something that was only possible with JavaScript previously.
Learning Objectives
Introduce the fundamentals of CSS anchor, including properties like position-area
, position-anchor
, anchor-name
, position-visibility
, and position-try
, functions like anchor()
and anchor-size()
, and the anchor-center
value.
Prerequisites
For beginners of CSS anchor. Familiarity with the basics of CSS is recommended.