wrap-safe-inline-icon

Keeps a decorative trailing arrow or external-link glyph on the same line as the final word of wrapping inline text, by pulling the icon out of flow with absolute positioning at its static inline spot, reserving room through container padding, matching the icon height to the line height (including the 1lh unit and its fallback), and correcting vertical placement with translate alone. Covers Tailwind utilities and hand-written CSS. Use when building inline links or labels that end in an icon, or when an appended icon drops onto its own line at narrow widths. Not for leading icons, icon-only buttons, or text that can never wrap.

Version

v1.0.0

Size

16 KB

Updated

2026-10-12

Your client verifies the signature before reading. This explicit manual read is available on every plan. Free automatically loads five chosen skills; paid plans automatically load relevant skills across the library.