Parrallelograms

Without using pseudo-element

1. Add transform: skewXproperty to stretch the element on the X axis.
2. Problem !! Using this method involved that all childs elements will be stretch too.

Using pseudo-element

1. We first add position: relativeto the element parent.
2. We create our ::beforeelement in our CSS file.
3. Now, you can start to stylized your ::beforeelement.
4. Once your pseudo-element is correctly stylized you can simply add transform: skewon him to stretch only this element.