modisposition

A quick one about this technique quite common in Flash sites but rarely seen on Web. Have a look at the example first so you can understand what I am talking about ... got it ? What Is This About Let's say we have a background, a big massive graphic background surely not suitable for mobile phones, due data roaming, but maybe cool for desktop and fast ADSL. The background-size CSS property is able to let us decide if the image used as background should fit the whole element or only a portion of it. In this case the image should fit, by default, the whole height of the document with an auto width in order to let the browser adjust the scale. A differential scrolling is visible the moment we scroll the page ... please resize the window into a smaller one if you are in an HD monitor and start scrolling the page. At the very beginning, the default height of the image is 100%, as body background, and with some padding in order to let space for few important image parts such the header...

Update - Now We Do Right Thanks everybody for your tests and contributions. For those interested about why we were doing wrong please read both post and comments but for those just interested about the best way so far to serve correctly one or more font-face, this is the hack: @font-face { // define the font name to use later as font-family font-family: "uni05_53"; // define the font for IE which totally ignores local() directive src: url(../font/uni05/uni05_53.eot); // use local to let IE jump this line and // redefine the src for this font in order to let // other clever browser download *only* this font rather than 2 src: local("uni05_53"), url(../font/uni05/uni05_53.ttf) format("truetype"); } You can test directly this technique in my HTML5 Prime Directives Test Page Credits Paul Irish for its Bulletproof @font-face syntax Mikuso, comments, for his suggestions about server configurations, instantly followed by Weston...