html - Parallelogram with an image -

i have multiple images need in parallelogram shape this:

they should enclosed in divs, in carousel , link video pages. however, using regular images causes bounding box issues links due transparent areas.

which css property used transform images parallelogram shapes in above example?

there method in transform skewing objects. thing have out in div skew also. have apply twice. once skew div number of degrees , again skew picture inside opposite direction.

for example if div: transform: skewx(10deg);

you'll have picture: transform: skewx(-10deg);

here's link read more transform - because there's more meets eye.