Skew left side of div that has background image

[west4me]

I am trying to make a div that has the left side slanted and the div have a background image.
This example is exactly what I want: JSFiddle
I have tried and tried to make it work but I just can’t get the left side to skew instead of the right.

Any assistance would be greatly appreciated.

[__]

I have tried and tried to make it work but I just can’t get the left side to skew instead of the right.

What have you tried? Do you understand the syntax for the transform propoerty? Do you understand how this fiddle is making these shapes appear like a parallelogram?

The overflow: hidden is the key to this illusion. Here’s a version that lets you see what’s going on “behind the scenes” (hover over the shape).

[proffnick]

Your skews may have worked. The secret there is the negative margins. Go check it very well

[Author]

Posts