Is there a foreground equivalent to background-image in css?

Question

I want to add some shine to an element on webpage. I would prefer if I don\'t have to add additional html to the page. I want the image to appear in front of the element rat

Answer 1

A neat solution: box-sizing + padding-left, see more at css-tricks

Somewhere in your HTML:

The CSS for replacing the image (on hovering)

#test_replacement {
    width: 200px; //must be the size of your image (and the replacement one)
    height: 200px; //idem
    display: block;
}
#test_replacement:hover {
    box-sizing: border-box;
    background-image: url('somewhere/other_image.png');
    padding-left: 200px; //at least the size of the width
}