Skip to main content

Elements with slanted edges

The page Elemente mit Schrägen already contains various examples of elements with slanted edges.

Each section must be in its own article, which needs various classes:

primary-bg: background color
skw-tl: slant to the top left
skw-tr: slant to the top right
skw-bl: slant to the bottom left
skw-br: slant to the bottom right

For example, to give the article slants to the top right and bottom right (like the first example on the demo page), add the classes primary-bg skw-tr skw-br in the article settings under Expert settings.

Content box Content box

Reference table for the article classes:

SlantClasses in the articleScreenshot
top right - bottom rightprimary-bg skw-tr skw-br
top left - bottom leftprimary-bg skw-tl skw-bl
top left - bottom rightprimary-bg skw-tl skw-br
top right - bottom leftprimary-bg skw-tr skw-bl
top rightprimary-bg skw-tr
bottom rightprimary-bg skw-br
top leftprimary-bg skw-tl
bottom leftprimary-bg skw-bl