Building UI Components

Practical techniques for building common interface components — buttons, toolbars, tooltips and more — with semantic HTML and modern CSS.

Content tagged ui-components

• Tutorial:CSS-Only Tooltips with attr() and content

  Styled, keyboard-friendly tooltips from one HTML attribute — no JavaScript.

  Build CSS-only tooltips that read their text from an HTML attribute with content: attr() — positioned with a ::after pseudo-element, given an arrow, revealed on hover and keyboard focus, flipped below the element and kept gentle under reduced motion — plus the accessibility limits and pitfalls to know before shipping one.