Plugin options
Column gutters: This is the space between individual columns.
Unstack: If you want to setup a grid with odd number of columns (for example 5 or 7) leave column settings undefined and use "Unstack" to make all columns fit into the row.
Horizontal align: When you create incomplete rows (total column count is less than 12) you can decide how to distribute the columns horizontally.
Additional CSS class names: Here you will sometimes have project specific row behaviours/styles. Moreover you can use Zurb Foundation row classes for example align-middle, align-top, align-bottom
Column gutters examples
Default
small-12 medium-3 column Lorem ipsum dolor sit amet, consetetur magna aliquyam erat, sed diam voluptua.
small-12 medium-3 column Lorem ipsum dolor sit amet, consetetur magna aliquyam erat, sed diam voluptua.
None
small-12 medium-3 column Lorem ipsum dolor sit amet, consetetur magna aliquyam erat, sed diam voluptua.
small-12 medium-3 column Lorem ipsum dolor sit amet, consetetur magna aliquyam erat, sed diam voluptua.
Unstack example
Medium unstack
Horizontal align example
Additional CSS class names example
align-bottom
small-12 medium-6 large-6 columns Lorem ipsum dolor sit amet, consetetur magna aliquyam erat, sed diam voluptua.
small-12 medium-6 large-6 columns Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus.
Columns
Class small, Class Medium, Class large: With this dropdowns you can specify the width of the column for a breakpoint withinour 12-columns grid- system. Examples "Small-6" = 6/12 = 1/2 = 50% on Small, "Medium-4" = 4/12 = 1/3 = 33.3% on Medium "Large-3" = 3/12 = 1/4 = 25% on Large. If you use "unstack" option in plugin, leave this dropdowns empty to distribute the columns automatically.
Additional CSS class names: Here you will sometimes have project specific row behaviours/styles. Moreover you can use Zurb Foundation Column classes and change the order of columns with "medium-order-2" on the first and "medium-order-1" on second column.
