Years ago I did some playing around with effects with CSS borders. Recently I came across this page which takes the idea a lot further. But the shapes on that page don't really do anything - for example they don't have any text in them. I thought I'd have a go at doing that. My CSS makes the shapes flexible (based on em units) and makes it easy to have different colours.
The triangles below make no use of images: they are done entirely with HTML and CSS.
The css for this is here. This has been successfully tested in Opera 11, Firefox 3.6, Chrome 13 and Internet Explorer 8.
Internet Explorer is, as usual, a problem. IE 8 doesn't respect the height attribute of the text div, so there is a rather large gap between the triangles and the next paragraph. I've fixed this by giving the following paragraph a negative margin in IE. Incidentally IE also told me that it had blocked execution of scripts when displaying this page, even though the page does not contain any!
So, what use is this? Well no, I don't know either. But maybe someone out there can come up with a good reason for me having wasted a couple of hours on it.