I installed IE9 Platform in March, tested it, tried out my websites and everything looked fine, but it was only until the release of last months Ie9 beta that I found out that our very own blog did not display correctly. The header appears to be broken in IE9 and this is most interesting since twentyten is a standard customizable theme of wordpress!

So it's time to find out what has changed in the world of HTML!

HTML5 and IE9 brings some cool new features we only could achieve using plug-ins like activeX, Silverlight, Flashplayers etc.
What does HTML5 mean?
No more codecs or frames.
New are footer, header, Navigation, Video, audio, canvas, article, svg
back from the old and recycled are <Ol> <dl> and <small> and also overlapping tags are allowed.

New ECMAScript 5 support - Supports ActionScript, JavaScript en JScript

Enhanced object Model
Selectors
Find elements by: CSS Selectors API

DOM API

getElementsByClassName

Allows css syntax

QuerySelectorAll() API
DOmContentLoaded

It loads the page as soon as the parsing is finished.
HTML5 also enables local storage and remebers your webinput even after a refresh, this new method makes your web available when no internet connection is available, you can even edit and modify web entry off line, the changes will be sent to the server as soon as an internet connection is available again.

It also brings us new binary attributes, whom work, by just being there! Just plain code for video and audio, no flash or silverlight is needed, no plug-ins. full javascript API It works for regular and fullHD video.

code example:

<video src="kewlmuvee.mp4" autoplay controls></video>
document.getElementById("video").play();

We want to ad some user options so they can controll the vid!

<video src="muvee.mpg" id="video">
</video>
<p>
<button onclick="document.getElementById('video').pause()">
Pause</button>
<button onclick="document.getElementById('video').play()">
Play</button>
<button onclick="document.getElementById('video').currentTime = 0">
Back to Beginning</button>

How cool is that!

Also a kewl new feature is Canvas, as a codejunky you don't want to draw a circle, you just want to Program it!

<html>
<p>HTML 5 Full Circle</p>
<svg>
<circle id="myCircle" cx="50%" cy="50%" r="100"
fill="url(#myGradient)"
onmousedown="alert('Itslet says Hi!');"/>
</svg>
</html>

<canvas>: Drawing programatically on screen, make dynamic pages you can move around and even convert back to a savable format for the guest on your site!

SVG Vector based graphics available, you can manipulate elements like colours in an advanced way, like transparency  and multiple colours.
Multiple Web standard colours can be used in designing websites:
Hexadecimal colours, a very common used webcolour and start with a #.
HSL is a colour standard used for printed matter, (Hue, Saturation and lightness) and (Alpha)transparency

A new Font upcoming standard, which will also make it possible importing (multiple) Fonts “WOFF” in your css (read more about it at web open font format).
(URL) media/Fonttype.woff

With Media queries you can have multiple css types in one page for different media.
So your webpage will display in the correct format on your Phone, Ipad, browsertype etc.
e.g NO.css (Max-width px) with this info available the devices choose what css is loaded to display the site.

Gone in HTML5 but still available:
<Applets> use <embedded>
<big> use css
<blink> use css
<center> use css
<font> use css

But i can tell you about all this great features, but you just have to go and see for yourself, implementing HTML5 in all your webdevelopment will make the web faster, cleaner and simple!

To conclude with the wordpress 2010 theme, it does not seem like a wordpress error at, the css looks fine, so I tried a work around I found at wordpress , and changed the stylesheet at line 365 to "display : inline;"

Want more? Install Platform, IE9 and start by visiting this webpage http://ie.microsoft.com/testdrive/Performance/msPerformance/Default.html?loaded=2