In a recent design we needed a giant button that would scale well from mobile to desktop. By combining viewport width scaling and pixel scaling with a calculation you can make a font size scale, but never scale smaller than a minimum size. <a href="#example" style="display: block; background-color: #5588aa; padding: 20px; color: #fff; text-align: center; font-size: 30px; font-size:calc(30px + 1.6vw);">Big Button Text</a> Demo: Big Button Text Both calc and viewport-units have wide support right now. Remember to set a fallback font-size for fringe browsers. More information Chris Coyier: Viewport sized typography David Walsh: A Couple of Use Cases for Calc() Jen Simmons: Progressing Our Layouts Vasilis van Gemert: Create the perfect website layout system
One Idea A Day, What I Learned Today