The shadow for the image using CSS. Revamped.

Inspired by this: habrahabr.ru/blog/css/36860.html

To begin, let me remind you that to create a double / non-standard frame for images, you need {... cut ...}, or you need to put a picture in a container and set the indent and background image for the container .

And so on. There is a better way!


No, there will be no containers, no borders and no javascript, but just one line of CSS:

img { background: url(shadow.jpg) right bottom no-repeat; padding: 0 12px 14px 0; }

Yes Yes! Exactly. For img, you can also set the background as a picture, not just colors. And ... * drum roll * it works everywhere! (why wouldn't he work?)
Apparently, the majority of web developers had the opinion that img is a drawing, and that’s why he needs a background? :) And they started shoving shadows into containers ... We break stereotypes!
')
- I do not believe it!
- Trust me, it is!

Yes, our shadow is of a fixed size and must be drawn in advance either in Photoshop or somewhere else.