Some info before you go on
The column template is based on percentages. Meaning that no matter where you put a one-half column, it will always be half of that total width.
Take some time to read these 4 blocks of information.
Size
The column shortcode has only one base shortcode, but many attributes. You will always use the shortcode «column», but changing the attribute size=»».
Last Columns
Whenever you’re setting a group of columns, the last one that closes the whole block, will need the last attribute. For example, when we have 3 columns with size one-third, the third column will have the attribute last=»true»
Columns Inside Columns
You are most welcome to put columns inside columns. A one-half column inside a one-half column will consequently give you a one-fourth column. Just keep in mind that this may cause troubles, so add a _ sign in front of the shortcode
For example. If you have a one-half inside a one-half, The child column, instead of being [column size="one-half] it will be [_column size="one-half]. You can add up to 5 _ signs.
one-half
Aenean ac felis sit amet nisi vestibulum accumsan. Aenean bibendum ultrices felis, at tincidunt dui fermentum sit amet. Praesent risus neque, mollis ut volutpat eget, ornare sed velit. Vivamus eu ipsum sapien. Aliquam id lacus eu orci accumsan pellentesque. Cras laoreet velit at quam tempus pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse potenti. Suspendisse in consequat orci.
[sourcecode language=»plain»][column size="one-half"]
<p> … </p>
[/column][/sourcecode]
one-half Last
Aenean ac felis sit amet nisi vestibulum accumsan. Aenean bibendum ultrices felis, at tincidunt dui fermentum sit amet. Praesent risus neque, mollis ut volutpat eget, ornare sed velit. Vivamus eu ipsum sapien. Aliquam id lacus eu orci accumsan pellentesque. Cras laoreet velit at quam tempus pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse potenti. Suspendisse in consequat orci.
[sourcecode language=»plain»][column size="one-half" last="last"]
<p> … </p>
[/column][/sourcecode]
one-third
Aenean ac felis sit amet nisi vestibulum accumsan. Aenean bibendum ultrices felis, at tincidunt dui fermentum sit amet. Praesent risus neque, mollis ut volutpat eget, ornare sed velit. Vivamus eu ipsum sapien.
[sourcecode language=»plain»][column size="one-third"]
<p> … </p>
[/column][/sourcecode]
two-thirds Last
Aenean ac felis sit amet nisi vestibulum accumsan. Aenean bibendum ultrices felis, at tincidunt dui fermentum sit amet. Praesent risus neque, mollis ut volutpat eget, ornare sed velit. Vivamus eu ipsum sapien. Aliquam id lacus eu orci accumsan pellentesque. Cras laoreet velit at quam tempus pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse potenti. Suspendisse in consequat orci. Suspendisse potenti. Suspendisse in consequat orci. Suspendisse potenti. Suspendisse in consequat orci.
[sourcecode language=»plain»][column size="two-thirds" last="last"]
<p> … </p>
[/column][/sourcecode]
one-fourth
Aenean ac felis sit amet nisi vestibulum accumsan. Aenean bibendum ultrices felis, at tincidunt dui fermentum sit amet. Praesent risus neque, mollis ut volutpat eget.
[sourcecode language=»plain»][column size="one-fourth"]
<p> … </p>
[/column][/sourcecode]
three-fourths Last
Aenean ac felis sit amet nisi vestibulum accumsan. Aenean bibendum ultrices felis, at tincidunt dui fermentum sit amet. Praesent risus neque, mollis ut volutpat eget, ornare sed velit. Vivamus eu ipsum sapien. Aliquam id lacus eu orci accumsan pellentesque. Cras laoreet velit at quam tempus pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse potenti. Suspendisse in consequat orci. Suspendisse potenti. Suspendisse in consequat orci. Cras laoreet velit at quam tempus pellentesque. Suspendisse potenti. Suspendisse in consequat orci.
[sourcecode language=»plain»][column size="three-fourths" last="last"]
<p> … </p>
[/column][/sourcecode]
four-fifths
Aenean ac felis sit amet nisi vestibulum accumsan. Aenean bibendum ultrices felis, at tincidunt dui fermentum sit amet. Praesent risus neque, mollis ut volutpat eget, ornare sed velit. Vivamus eu ipsum sapien. Aliquam id lacus eu orci accumsan pellentesque. Cras laoreet velit at quam tempus pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse potenti. Suspendisse in consequat orci. Suspendisse potenti. Suspendisse in consequat orci. Cras laoreet velit at quam tempus pellentesque. Suspendisse potenti. Suspendisse in consequat orci.
[sourcecode language=»plain»][column size="four-fifths"]
<p> … </p>
[/column][/sourcecode]
one-fifth Last
Aenean ac felis sit amet nisi vestibulum accumsan. Aenean bibendum ultrices felis.
[sourcecode language=»plain»][column size="one-fifth" last="last"]
<p> … </p>
[/column][/sourcecode]
two-fifths
Aenean ac felis sit amet nisi vestibulum accumsan. Aenean bibendum ultrices felis, at tincidunt dui fermentum sit amet. Praesent risus neque, mollis ut volutpat eget, ornare sed velit. Vivamus eu ipsum sapien. Aliquam id lacus eu orci accumsan pellentesque. Cras laoreet velit at quam tempus pellentesque. Lorem ipsum dolor sit amet, consectetur.
[sourcecode language=»plain»][column size="two-fifths"]
<p> … </p>
[/column][/sourcecode]
three-fifths last
Aenean ac felis sit amet nisi vestibulum accumsan. Aenean bibendum ultrices felis, at tincidunt dui fermentum sit amet. Praesent risus neque, mollis ut volutpat eget, ornare sed velit. Vivamus eu ipsum sapien. Aliquam id lacus eu orci accumsan pellentesque. Cras laoreet velit at quam tempus pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse potenti. Suspendisse in consequat orci. Suspendisse potenti. Suspendisse in consequat orci. Cras laoreet velit at quam tempus pellentesque. Suspendisse potenti. Suspendisse in consequat orci.
[sourcecode language=»plain»][column size="three-fifths" last="last"]
<p> … </p>
[/column][/sourcecode]
one-sixth
Aenean ac felis sit amet nisi vestibulum accumsan.
[sourcecode language=»plain»][column size="one-sixth"]
<p> … </p>
[/column][/sourcecode]
five-sixths last
Aenean ac felis sit amet nisi vestibulum accumsan. Aenean bibendum ultrices felis, at tincidunt dui fermentum sit amet. Praesent risus neque, mollis ut volutpat eget, ornare sed velit. Vivamus eu ipsum sapien. Aliquam id lacus eu orci accumsan pellentesque. Cras laoreet velit at quam tempus pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse potenti. Suspendisse in consequat orci. Suspendisse potenti. Suspendisse in consequat orci. Cras laoreet velit at quam tempus pellentesque. Suspendisse potenti. Suspendisse in consequat orci.
[sourcecode language=»plain»][column size="five-sixths" last="last"]
<p> … </p>
[/column][/sourcecode]