For advanced content creators who can use HTML code, this is the HTML code that created the reference page.

Reference For Content Styling based on grid system

12 Grid (1 column across the page)

Eget tincidunt est proin, imperdiet nec leo nisl tellus morbi, ac vitae nec est ultricies integer. Tristique pellentesque ut vestibulum quis quam ornare, lorem ipsum tristique nunc massa veritatis augue. Ultricies volutpat aenean ante non, lorem proin quis velit, est ullamcorper dui nullam diam integer, mi non felis posuere in eget. Magna turpis ullamcorper, eu cras aliquam purus laoreet, dis tellus, euismod dui in. Nec pretium aliquet sed consectetuer hendrerit, est morbi blandit semper, laoreet ornare in suscipit pellentesque erat amet. Euismod leo pharetra tristique nulla, nec vitae. A quisque faucibus. Erat sapien nam quam, vehicula egestas elit pellentesque vitae vel nam, ac lacus enim cras sagittis, ipsum accumsan rutrum nibh vitae sodales. Ipsum mauris mauris et. Eu ut, dictum commodo, enim duis etiam consequat donec torquent, ridiculus vitae eu. Sodales ac, et ante imperdiet, habitant nunc auctor dapibus bibendum lectus, adipiscing odio ac non nunc pede aenean. Dignissim velit condimentum, quis metus posuere sed et nulla, vulputate eget commodi commodo, aliquam nullam, wisi magna ac pretium montes. Vitae suspendisse sit accumsan sed eget neque, vestibulum ac wisi commodo sodales scelerisqu
_________________________________________________________________________________

6 Grid + 6 Grid (2 column even)

Column #1
Ultricies purus vestibulum feugiat lectus, dui dapibus, et velit ad lorem nibh, libero eget ligula enim donec, orci omnis vulputate porta lacinia. Gravida orci, ipsum lacinia, varius duis tincidunt, eget semper integer sed. Placerat sit pulvinar fringilla parturient dictum netus, pellentesque ultricies magna vitae at est id. Dignissim diam id nulla odio, aliquet lorem, et faucibus elementum, vel quis facilisis mattis molestie nec dis, hac justo maecenas quis eget dolor dapibus.
Column #2
Ultricies purus vestibulum feugiat lectus, dui dapibus, et velit ad lorem nibh, libero eget ligula enim donec, orci omnis vulputate porta lacinia. Gravida orci, ipsum lacinia, varius duis tincidunt, eget semper integer sed. Placerat sit pulvinar fringilla parturient dictum netus, pellentesque ultricies magna vitae at est id. Dignissim diam id nulla odio, aliquet lorem, et faucibus elementum, vel quis facilisis mattis molestie nec dis, hac justo maecenas quis eget dolor dapibus.
_________________________________________________________________________________

4 Grid + 8 Grid (2 column 30% by 70%)

Column #1
Ultricies purus vestibulum feugiat lectus, dui dapibus, et velit ad lorem nibh, libero eget ligula enim donec, orci omnis vulputate porta lacinia. Gravida orci, ipsum lacinia, varius duis tincidunt,
Column #2
Ultricies purus vestibulum feugiat lectus, dui dapibus, et velit ad lorem nibh, libero eget ligula enim donec, orci omnis vulputate porta lacinia. Gravida orci, ipsum lacinia, varius duis tincidunt, eget semper integer sed. Placerat sit pulvinar fringilla parturient dictum netus, pellentesque ultricies magna vitae at est id. Dignissim diam id nulla odio, aliquet lorem, et faucibus elementum, vel quis facilisis mattis molestie nec dis, hac justo maecenas quis eget dolor dapibus.
_________________________________________________________________________________

4 + 4 + 4 Grid (3 column even)

Column #1
Ultricies purus vestibulum feugiat lectus, dui dapibus, et velit ad lorem nibh, libero eget ligula enim donec, orci omnis vulputate porta lacinia. Gravida orci, ipsum lacinia, varius duis tincidunt, eget semper integer sed. Placerat sit pulvinar fringilla parturient dictum netus, pellentesque ultricies magna vitae at est id. Dignissim diam id nulla odio, aliquet lorem, et faucibus elementum, vel quis facilisis mattis molestie nec dis, hac justo maecenas quis eget dolor dapibus.
Column #2
Ultricies purus vestibulum feugiat lectus, dui dapibus, et velit ad lorem nibh, libero eget ligula enim donec, orci omnis vulputate porta lacinia. Gravida orci, ipsum lacinia, varius duis tincidunt, eget semper integer sed. Placerat sit pulvinar fringilla parturient dictum netus, pellentesque ultricies magna vitae at est id. Dignissim diam id nulla odio, aliquet lorem, et faucibus elementum, vel quis facilisis mattis molestie nec dis, hac justo maecenas quis eget dolor dapibus.
Column #3
Ultricies purus vestibulum feugiat lectus, dui dapibus, et velit ad lorem nibh, libero eget ligula enim donec, orci omnis vulputate porta lacinia. Gravida orci, ipsum lacinia, varius duis tincidunt, eget semper integer sed. Placerat sit pulvinar fringilla parturient dictum netus, pellentesque ultricies magna vitae at est id. Dignissim diam id nulla odio, aliquet lorem, et faucibus elementum, vel quis facilisis mattis molestie nec dis, hac justo maecenas quis eget dolor dapibus.
_________________________________________________________________________________

2 + 2 + 4 +4 Grid (4 column - 2 Small - 2 wide)

two columns
Erat sapien nam quam, vehicula egestas elit pellentesque vitae vel nam, ac lacus enim cras sagittis, ipsum accumsan rutrum nibh vitae sodales. Ipsum mauris mauris et. Eu ut, dictum commodo, enim duis etiam consequat donec torquent, ridiculus vitae eu.
two columns
Erat sapien nam quam, vehicula egestas elit pellentesque vitae vel nam, ac lacus enim cras sagittis, ipsum accumsan rutrum nibh vitae sodales. Ipsum mauris mauris et. Eu ut, dictum commodo, enim duis etiam consequat donec torquent, ridiculus vitae eu.
four columns
Erat sapien nam quam, vehicula egestas elit pellentesque vitae vel nam, ac lacus enim cras sagittis, ipsum accumsan rutrum nibh vitae sodales. Ipsum mauris mauris et. Eu ut, dictum commodo, enim duis etiam consequat donec torquent, ridiculus vitae eu. Erat sapien nam quam, vehicula egestas elit pellentesque vitae vel nam, ac lacus enim cras sagittis, ipsum accumsan rutrum nibh vitae sodales. Ipsum mauris mauris et. Eu ut, dictum commodo, enim duis etiam consequat donec torquent, ridiculus vitae eu.
four columns
Erat sapien nam quam, vehicula egestas elit pellentesque vitae vel nam, ac lacus enim cras sagittis, ipsum accumsan rutrum nibh vitae sodales. Ipsum mauris mauris et. Eu ut, dictum commodo, enim duis etiam consequat donec torquent, ridiculus vitae eu. Erat sapien nam quam, vehicula egestas elit pellentesque vitae vel nam, ac lacus enim cras sagittis, ipsum accumsan rutrum nibh vitae sodales. Ipsum mauris mauris et. Eu ut, dictum commodo, enim duis etiam consequat donec torquent, ridiculus vitae eu.Erat sapien nam quam, vehicula egestas elit pellentesque vitae vel nam, ac lacus enim cras sagittis, ipsum accumsan rutrum nibh vitae sodales. Ipsum mauris mauris et. Eu ut, dictum commodo, enim duis etiam consequat donec torquent, ridiculus vitae eu.
_________________________________________________________________________________

Custom List Style #1

_________________________________________________________________________________

Custom List Style #2

_________________________________________________________________________________

Block Quote Left

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous Source Title
_________________________________________________________________________________

Block Quote right

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous Source Title
_________________________________________________________________________________

Description Lists

Description lists
A description list is perfect for defining terms.
Euismod
Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
Donec id elit non mi porta gravida at eget metus.
Malesuada porta
Etiam porta sem malesuada magna mollis euismod.
Felis euismod semper eget lacinia
Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
_________________________________________________________________________________

Making Buttons - Go in paragraph tags

_________________________________________________________________________________

Large collection of available ICONS

- Download icon in H1 tag

- Facebook Icon in Paragraph tag

See the full set available at this link: http://fortawesome.github.io/Font-Awesome/icons/

_________________________________________________________________________________