Can you invent your own CSS elements?

[Kaido]

I'm studying CSS right now and I was wondering if it is possible to create your own CSS elements. I know that you can create custom selectors for classes or IDs, but what about elements? Say I wanted to create an element called "kaido" and attach a class to it, like so:

kaido.header {h1; color: #ebebeb; text-decoration: underline}

Then I would use that in the HTML file like this:

<kaido class="header">This is the title of the article</kaido>

Is that possible? Or is CSS locked into existing HTML/XHTML elements?

Edit: I should re-phrase my question: is it *legal* and valid to create custom elements? I know that it works, but I'm striving for 100% validation...

 

[MrChad]

You can, but how will a browser understand how to render <kaido>?

 

[Kaido]

Originally posted by: MrChad
You can, but how will a browser understand how to render <kaido>?

Because of the CSS definition I think the only real way to do this is to modify the XHTML Transitional DTD and load it on my own site. Too much hassle for what I'm doing, though, so I guess I'll just stick with standard elements.

 

[notfred]

Yes, CSS was designed to do this, because it can be used to style arbitrary XML documents and not just XHTML/HTML. Not all web browsers do a fantastic job of rendering arbitrary XML, though.

 

[Kaido]

Originally posted by: notfred
Yes, CSS was designed to do this, because it can be used to style arbitrary XML documents and not just XHTML/HTML. Not all web browsers do a fantastic job of rendering arbitrary XML, though.

Firefox is doing pretty well with my imaginary CSS-based elements so far I ran it through an initial validation (w3c) and it didn't like my custom tags at all. But it works in the browser. Ho-hum. More reading here for interested parties:

http://www.alistapart.com/articles/customdtd