A modern CSS technique for centering absolutely-positioned elements using just three lines: `position: absolute`, `place-self: center`, and `inset: 0`. The post explains why the classic `top: 50%; left: 50%; translate: -50% -50%` approach still works but introduces the concept of the Inset-Modified Containing Block (IMCB) to explain how `align-self` and `justify-self` now apply to absolute elements. Setting `inset: 0` expands the IMCB to match the containing block, allowing `place-self` to center the element correctly. The technique works across all major browsers and also supports non-center alignment values for flexible absolute positioning.

Sort: