Make a CSS triangle with transparent background on a div with white bg image?

Question

Ok so, I\'m trying to replicate the effect you see here at the bottom of the page, with the back to top button: http://www.ppp-templates.de/tilability/ - After the content a

Answer 1

Here you go, http://jsfiddle.net/pkUx7/1/

HTML

CSS

body {
    background-color: purple;
}   

div {
    margin:0;
    padding:0;
    background-color: violet;
}

#footer {
    height: 100px;
}

#bottom-line-left, #bottom-line-right {
    display: inline-block;
    height: 20px;
}

#bottom-line-left {
    width: 61%;
}

#bottom-line-right {
    float: right;
    width: 37%;
}

#triangle {
    margin-left:-6px;
    margin-right: -4px;
    padding:0;
    display: inline-block;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 20px solid purple;
}