The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS CSS Transform Skew One Side with RGBA Reply To: CSS Transform Skew One Side with RGBA


I know this is an old thread, but I recently had to do something similar; two rectangles side-by-side, with the two inside edges slanted. Skew didn’t work because it extended the rectangles outside the canvas area. After doing it a few ways (none of which I was happy with due to being too “hacky” for my taste), I managed to pull it off using :before and :after pseudo-elements.

See demo at CodePen here:
On Github:

Feedback or criticism welcome.