# CSS Image Masking

**URL:** <https://forum.kirupa.com/t/css-image-masking/222310>\
**Category:** web dev\
**Created:** [April 12, 2007, 1:42pm UTC](https://forum.kirupa.com/t/css-image-masking/222310 "2007-04-12T13:42:15Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![opel](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/opel/32/199_2.png) [@opel](https://forum.kirupa.com/u/opel)\
**Post date:** [April 12, 2007, 1:42pm UTC](https://forum.kirupa.com/t/css-image-masking/222310/1 "2007-04-12T13:42:15Z")

</div>

I use CSS everyday for web design but there is one thing I have always had trouble with and that is image masking… can anyone tell me how I can overlay a mask like the sale badge and border over another image?

I have provided an example below of what I mean, the example being a dress in an e-commerce shop that I can change. I have tried overlapping div’s and combinging background and transparent gifs with no success, can anyone help?

![](http://www.diskokitten.co.uk/eflyers/untitled-1.jpg)