Order before 3pm for same day dispatch
Grid Examples with Backgrounds
I've added the "show-grid" class so that each of the grid sections are highlighted when you hover on them.
12 - Full Width
6 x 6 - Half Width
4 x 4 x 4 - Thirds
3 x 3 x 3 x 3 - Quaters
4 x 8 - Mixed
8 x 4 - Mixed Reverse
Daves Mixed Up Example
Grid Examples without Backgrounds
These are the same grids as above, but without the highliting when hovered. Use these for your website.
12 - Full Width
6 x 6 - Half Width
4 x 4 x 4 - Thirds
3 x 3 x 3 x 3 - Quaters
4 x 8 - Mixed
8 x 4 - Mixed Reverse
Grid Examples With Content
This is an example of the grids in use with text. The format below is using 4 x 8
My block title 1
Praesent viverra blandit tincidunt. Nulla eu justo vel eros euismod rhoncus non et turpis. Praesent varius nunc non aliquet imperdiet. Quisque a lacinia arcu. Ut pulvinar lacinia ligula. Vivamus elementum varius pharetra. Vestibulum fermentum fermentum justo vitae venenatis. Etiam nec neque quam. Quisque pretium orci in ligula tempor, et placerat libero viverra.
My block title 2
Praesent viverra blandit tincidunt. Nulla eu justo vel eros euismod rhoncus non et turpis. Praesent varius nunc non aliquet imperdiet. Quisque a lacinia arcu. Ut pulvinar lacinia ligula. Vivamus elementum varius pharetra. Vestibulum fermentum fermentum justo vitae venenatis. Etiam nec neque quam. Quisque pretium orci in ligula tempor, et placerat libero viverra.
My block title 3
Integer pulvinar aliquet nisl. Nulla velit sem, eleifend a nisi non, facilisis auctor ante. Suspendisse potenti. Cras lobortis mauris porta nibh pulvinar consectetur. Duis ut molestie leo. Aenean malesuada vestibulum interdum. Donec in luctus nibh, lobortis auctor libero. Nullam vel mi non dolor consectetur facilisis. Fusce pellentesque nulla id quam sodales, a ultricies lectus venenatis. Vivamus molestie sagittis nunc et dapibus. Aliquam velit augue, semper gravida egestas ut, laoreet ac lacus. Nulla venenatis neque sit amet fermentum congue. Curabitur elementum tellus vitae sagittis sollicitudin.
My block title 4
Nullam ullamcorper, eros vel imperdiet volutpat, ipsum dolor iaculis libero, id blandit massa turpis a tellus. Aenean in viverra nunc. Maecenas vitae vehicula quam, et tristique velit. Quisque sed eros pellentesque, commodo justo a, accumsan mi. Maecenas fringilla quam eget neque convallis, id fermentum magna lacinia. Nunc ut lacus elit. Aliquam fermentum, erat non ornare rhoncus, erat est interdum est, sit amet mattis lectus sem et lorem. Curabitur feugiat sem a laoreet rhoncus. Proin egestas egestas eros. Cras laoreet leo dapibus lacus rhoncus, at mattis leo dictum. Vivamus id mauris mauris. Aliquam tincidunt tempus augue, at sagittis arcu condimentum eu. Suspendisse a volutpat odio. Nunc ut ante dapibus, laoreet neque vitae, aliquet velit. Phasellus sit amet velit eu quam fermentum viverra.
Also...
Ultimo comes with numerous other styel classes and features, here are a few examples:
Icons
A Star icon

A promotion icon

A globe icon

A delivery icon

Large Icons
A large star icon

A large menu icon

A large painbrush icon

A large responsive icon

Shapes for Icons
You can also make different shape icons



And change their colours if you wanted to using a little CSS:

Social Icons
Ultimo also has the social icons built in too:
Mixing it up a little
Without looking at the html, can you guess what's happening here?

Title
This is sample text
Another paragraph

Title
This is sample text
Another paragraph

Title
This is sample text
Another paragraph

Title
This is sample text
Another paragraph