Why so square?

Slanted <div> layout

This is the top div.
Made with pure CSS and HTML. Lorem ipsum dolor sit amet, consectetur.

This is the middle div.
Excepteur sint occaecat cupidatat.

This is the bottom div.
Ut enim ad minim veniam, quis nostrud exercitation ullamco.
You can edit and try out this HTML in this codepen by following this link.

(♫ It’s hip to be … ♫)