Well, after a lot of try-outs I gave up.
SVG worked a little bit but transparancy isn't supported in chrome so there is a white block instead of the cards, the only thing shown is the text. Though in firefox transparancy worked and IE needs a plugin to use it.
But, this gives me a lot of work and its very time consuming.
Now we've deceided to keep the text straight and maybe look for another alternative when support is approved.
It's probably too late, but what about just using an image map? You could create slices using photoshop or paint shop pro. It would be a little bit choppy to create, but not that bad, and should be seamless to users. The slices cannot be rotated as far as I know, so you would just need to create a row of boxes over each menu item. See the attached image for a sample of what I'm talking about. As long as there is no space between the different blocks, your users would not know the difference.