HTML and CSS Reference
What you do here is break the rules a little—by placing a prefixed property below the nonprefixed property—but
only to fix the issue caused by Microsoft breaking the rules—supporting the nonprefixed transform property be-
fore it fully supported the nonprefixed -ms-transform property.
Because you place the -ms-transform: none; declaration below the transform: rotateY(-40deg);
declaration, Internet Explorer 10 does not have a transform applied to it. The sidebar just falls back to 2D. This is the
safest way to deal with Microsoft's shortcomings. If—and it's always a big if with Internet Explorer—Microsoft
does follow the advice set out in the CSS specifications, it will eventually drop support for prefixed properties such
as -ms-transform , so your declaration of -ms-transform: none; will be ignored and the transform:
rotateY(-40deg); declaration will be used in its place. This result is what is desired for Cool Shoes & Socks
anyway; you just have to take these measures temporarily while Internet Explorer 10 doesn't fully support 3D trans-
Internet Explorer 9
Internet Explorer 9 offers a similar experience to Opera 12. @keyframes and 3D transforms aren't supported.
Neither are transitions, so when you hover over the “25% banner,” the banner just snaps between sizes. The rounded
corners on elements are also unsupported. Again, this lack of support isn't a problem. The users will never know
anything is wrong because the page still appears and functions perfectly for them; they just miss out on a few visual
In Chapter 1, I mentioned that Firefox 3.6 is still in use today—despite the latest Firefox being version 13 at the time
of writing! Firefox 3.6 provides a similar experience to Internet Explorer 9, and thanks to the best practices you've
adhered to throughout CSS3 Foundations , it doesn't require any additional attention; it displays and functions to the
level the browser is capable of.
Testing Older Versions of Internet Explorer
So far, the browser-testing ride has been pretty smooth. Cool Shoes & Socks works in the latest versions of modern
browsers used today. It's a certainty that older versions of Internet Explorer will require some extra attention though.
Internet Explorer 8
From the outset, Cool Shoes & Socks doesn't look too bad in Internet Explorer 8, although a few issues arise as you
move down the page, as shown in Figure 15-6.