I actually posted in the 2nd sticky thread here about this. I was tearing my hair out until I found this. I'll repeat if you want it here:
Assuming a fixed width (so think what the longest text could possibly be first), you would use a type of submit button called "image" (instead of input type="submit" it'll be input type="image" with all the rest of the normal stuff). Image submits do everything normal submits do but you get to add an image. Unfortunately, the image sits in the HTML and thus would cover any text.
(I wrote that as if it were XHTML, otherwise disregard the slash at the end.)
<input type="image" src="whatever.gif" class="funkysubmit" height="whatever" width="whatever" alt="text for the submit" value="text for the submit" />
So the trick is, make that image a transparent gif.
Then there's a see-through "window" to any background images you want. These images sit under your text, so those without images or CSS will still see what to click on.
<input type="image" src="transparent.gif" etc... />
I say .gif because with rounded corners, and images being squares, you'd want transparency on the rounded corners so whatever background or background colour you have on the form will show through.
background: url(whatever funky background with rounded corners you want.gif) 0 0 no-repeat;
I'm not sure what's Sliding Doors here except when you want the background image to change on hover and click. (neither work in IE6 without Jscript and :active doesn't work in IE7, but wth.) In which case the best thing is to make one image with three states (three images side by side) and setting their positions with CSS (traditional Sliding Doors).
I made a nice example of this that I'm happy with, but now that it's a working site and has advertisements, I don't want to post it anymore here, but if you want the address you can PM me (or maybe I posted it long ago on the other thread, without ads).