Styling Conventions

This page provides an overview of the Page Builder styling conventions.

Row without fill/border and without columns
Row: margin 10px, padding 10px

Heading Text

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc sit amet urna id justo pellentesque maximus a ut massa. Aliquam erat volutpat. In mollis hendrerit lectus vitae aliquet. Vestibulum luctus justo quis justo venenatis consectetur. Sed imperdiet quis lacus sit amet blandit. Morbi diam libero, dictum sed tempor sit amet, suscipit vel dui.

Row without multiple fill/border columns
Row: margin 10px, padding 0px
Column: margin 10px, padding: 20px

A header

Nam non lorem vitae ex malesuada aliquam. Donec sit amet felis ut quam vulputate aliquam at eget tortor. Vivamus vel justo sem. Integer eget porta tortor. Vestibulum vel aliquam dui. Integer suscipit risus libero, eu convallis erat cursus vel. Praesent sem lacus, eleifend eget fringilla ut, venenatis id purus. Sed eu sagittis felis. Sed vitae turpis magna. Pellentesque scelerisque dictum tincidunt. Vestibulum efficitur iaculis urna, sed vehicula odio rhoncus sit amet. Donec felis elit, condimentum imperdiet ultricies quis, malesuada vitae eros.

A text header

Fusce varius sagittis nibh, vitae ullamcorper felis dapibus sit amet. In quis sodales sapien. Suspendisse fringilla velit tellus, in rutrum augue tempus eget. Aliquam scelerisque lorem ultricies faucibus bibendum. Praesent venenatis dictum lobortis. Vivamus varius leo rhoncus dui pharetra, sed congue tellus cursus. Sed et lorem blandit, consectetur felis vel, dignissim augue. Integer maximus ultricies nibh, nec sagittis libero dignissim eget. Integer ac ipsum magna.

Row with multiple borderless columns
Row: margin 10px, padding 0px
Column: margin 10px, padding: 0px

Heading

Maecenas vitae leo ut leo rutrum tincidunt vitae eget felis. Sed non diam a enim gravida feugiat. Donec quis vestibulum felis. Donec ultrices efficitur ultrices. Maecenas dignissim elit velit, sit amet pretium odio varius ut. Duis sed nibh libero. Suspendisse lectus nibh, posuere convallis tincidunt sed, scelerisque non lacus.

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et metus in nisi facilisis lacinia dapibus at ipsum. In nunc ex, commodo sit amet feugiat sit amet, iaculis gravida augue. Phasellus scelerisque vulputate augue, vitae semper nulla gravida gravida. Interdum et malesuada fames ac ante ipsum primis in faucibus.

Heading

Sed non aliquet elit. Quisque fermentum urna in nibh pulvinar tincidunt. Sed vehicula mollis posuere. Nulla eget dui placerat, maximus leo commodo, hendrerit felis. Nulla pellentesque urna a urna gravida, in dapibus tortor volutpat.

Row with mixed columns
Row: margin 10px, padding 0px
Column 1 and 3: margin 10px, padding: 20px
Column 2: margin 10px, padding 0px

Heading

Maecenas vitae leo ut leo rutrum tincidunt vitae eget felis. Sed non diam a enim gravida feugiat. Donec quis vestibulum felis. Donec ultrices efficitur ultrices. Maecenas dignissim elit velit, sit amet pretium odio varius ut. Duis sed nibh libero. Suspendisse lectus nibh, posuere convallis tincidunt sed, scelerisque non lacus.

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et metus in nisi facilisis lacinia dapibus at ipsum. In nunc ex, commodo sit amet feugiat sit amet, iaculis gravida augue. Phasellus scelerisque vulputate augue, vitae semper nulla gravida gravida. Interdum et malesuada fames ac ante ipsum primis in faucibus.

Heading

Sed non aliquet elit. Quisque fermentum urna in nibh pulvinar tincidunt. Sed vehicula mollis posuere. Nulla eget dui placerat, maximus leo commodo, hendrerit felis. Nulla pellentesque urna a urna gravida, in dapibus tortor volutpat.