Michael Scharnagl 11/2/2015

Using text-shadow instead of font-weight bold to avoid jumping

Read Original

This technical article explains a CSS workaround to prevent the 'jumping' effect when using font-weight: bold on hover states. It details using text-shadow to simulate bold text, ensuring element width remains stable. It also covers browser support and provides implementation methods using conditional comments and CSS feature queries (@supports) for older IE versions and modern browsers.

Using text-shadow instead of font-weight bold to avoid jumping

Comments

No comments yet

Be the first to share your thoughts!

Browser Extension

Get instant access to AllDevBlogs from your browser

Top of the Week

1
The Beautiful Web
Jens Oliver Meiert 2 votes
2
Container queries are rad AF!
Chris Ferdinandi 2 votes
3
Wagon’s algorithm in Python
John D. Cook 1 votes
5
Top picks — 2026 January
Paweł Grzybek 1 votes
6
In Praise of –dry-run
Henrik Warne 1 votes
8
Vibe coding your first iOS app
William Denniss 1 votes