Question

Is it possible in CSS to create a background to look just like this

.test {
width: 0;
height: 0;

border-bottom: 60px solid transparent;

border-left: 60px solid green;
}

But I need a text to go over the diagonally. This is done by moving the border but I need it in background.
I know I can put an image but i really need to be CSS.
Thanks

Answer 1

Yes, you can use gradients. Though browser support is not complete (the usual suspects).

Here’s a live example.

Generated using ColorZilla’s Ultimate CSS Gradient Generator.