how to add picture in the background of a CSS triangle

Question

Like this

I've tried but so far i have made without any background using css border hack. How to advance it with an image like the the picture above?

this has been asked before see [here](http://stackoverflow.com/questions/23758922/transparent-arrow-triangle/23759602#23759602) and [here](http://stackoverflow.com/questions/16540274/creating-a-transparent-arrow-above-image-in-css3?lq=1) ... — web-tiki, Dec 09 '14 at 08:45
i did @Justinas but cant find out about how the image is placed image — Aritra Hazra, Dec 09 '14 at 08:47
This question wasn't an exact duplicate as the triangle is over other content and it needs to be seen. I added a solution for this situation in my answer here : [transparent arrow/triangle](http://stackoverflow.com/questions/23758922/transparent-arrow-triangle/23759602#23759602) — web-tiki, Dec 11 '14 at 14:42

score 2 · Answer 1 · edited May 23 '17 at 12:22

2

You can use CSS triangle generator and fix it.

width: 0;
height: 0;
border-style: solid;
border-width: 0 100px 100px 100px;
border-color: transparent transparent #007bff transparent

edited May 23 '17 at 12:22

Community

answered Dec 09 '14 at 08:44

Karmacoma

1 Answers1