With viewport units, you can describe width, height, font-size and other CSS styles as percentages of the viewport width and height. There are, however, a few nasty gotchas when it comes to using them in iOS Safari and IE9 and 10. They also don’t always play nice in CSS3 calc()
statements and don’t work at all in IE Visual Filters. Using them in iframes
can also be problematic. This post talks about how to work around these issues easily using a JavaScript buggyfill (not polyfill). I have used viewport units in production sites today, and now you can too, on any phone or device used in the wild today.
Fixing Cross-Browser Issues With CSS3 Viewport Units in IE9+ and Safari for iOS
Tags: CSS · CSS3 · IE Visual Filters · math · viewport units