Icons inside underlined links without text <span>ning (blades.ninja) 2 points by anydigital 3mo ago ↗ HN
[–] anydigital 3mo ago ↗ Use Blades `<i>`-helper to wrap emojis, favicons, or simply drop Font Awesome icons inside links. It automatically handles sizing and alignment while preventing underline on icons.How: `a:has(>i){ display: inline-flex }` and `a>i{ float: left }`Code: https://github.com/anydigital/blades/blob/main/src/link-icon...Demo: https://codepen.io/editor/anydigital/pen/019d2b94-5616-75dc-...Docs: https://blades.ninja/css/link-icon/ (available via CDN/npm)
1 comment
[ 4.5 ms ] story [ 12.6 ms ] threadHow: `a:has(>i){ display: inline-flex }` and `a>i{ float: left }`
Code: https://github.com/anydigital/blades/blob/main/src/link-icon...
Demo: https://codepen.io/editor/anydigital/pen/019d2b94-5616-75dc-...
Docs: https://blades.ninja/css/link-icon/ (available via CDN/npm)