Adding CSS marquee to HTML marquee

Let me begin by saying that I don't even like this feature, as I can't think of many nice uses for it, but I wanted to play around with the new CSS feature anyway.

HTML Marquee Element

You've seen this thing in the way back machine, it's really just moving the text within the marquee tag across the page. Wheeee! But, it's annoying, so it's rarely used - in fact, it was deprecated, but is now actually back in the form of a CSS3 spec (though not yet finalized, so browser implementations still vary/don't exist).

So, now we have both marquee (the HTML element), and -webkit-marquee- (the CSS version for Webkit)...They're both supported by webkit, so what happens if we apply BOTH?

As it turns out, it sort of just works. Adding overflow-x: -webkit-marquee; will make apparently any element behave like HTML marquee does. Additionally, even if you apply it to the HTML marquee, -webkit-marquee-direction: forwards; will change the scroll direction.

DEMO

The red text is the plain HTML marquee, the blue text is the CSS marquee running on another HTML marquee, and the green text is a paragraph with the CSS marquee. The second set of these are just within a div of class "forwards" to which I add the the direction. NOTE: You need to view this in either Chrome or Safari (Browser Support)...

Full Demo w/ Code