Andrew's Digital Garden

HTML inert

inert is a new HTML property that makes the browser 'ignore' user input for that element. This includes focus events and assistive technologies.

This is immensely helpful as it solves the same problem as a 'focus trap' does. A focus trap is when focus is trapped within an element (e.g. a modal) to avoid the user focusing outside of that area. inert takes the opposite approach, and instead disables everything you don't want to focus on.

Note that there's no inherit CSS styling for inert elements.

https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

[[a11y]] [[html]]

HTML inert