Using Tables and Columns
Introduction
Welcome to our tutorial on creating tables and columns on Physiopedia pages. This guide will help you understand the differences between tables and columns and which one to choose. By the end of this tutorial you will be adding tables and columns like an expert!
Tables vs Columns
Both columns and tables have the purpose of dividing your information, whether images, videos or text into sections across the page. However, which one you choose is very important as they have different purposes.
Differences between tables and columns
Tables are used to organise and present structured data, making it easier to compare and analyse information. Columns, on the other hand, are primarily used for layout purposes, dividing text or other content into vertical sections to improve readability and visual appeal.
Tables
- Purpose: Used to organise and present data in a structured format.
- Structure: Consists of rows and columns where each cell can contain different types of data.
- When to use: Best for comparing information, showing relationships between data points, and providing a clear, visual representation of data.
Columns
- Purpose: Used to organise text content into multiple sections, making it easier to read.
- Structure: Typically used for layout purposes, dividing text into vertical sections.
- When to use: Best for articles, newsletters, and content-heavy pages where you want to improve readability and make the text less overwhelming.
When to Use Tables or Columns
Choosing between tables and columns depends on the purpose and type of content you are presenting. Tables are better for structured data that needs to be compared and analysed, while columns are perfect for displaying images and pictures side by side or for improving the readability and visual appeal of your text by dividing it into vertical sections.
Use a Table when you need to:
- Present numerical data.
- Compare different items side by side.
- List information in a structured format.
- Provide a clear visual distinction between different sets of data.
Use Columns when you need to:
- Arrange images or videos side by side
- Organise a large amount of text.
- Make an article or document easier to read.
Please do not use tables for layout (e.g. images) - only use tables to display columns of data (such as below). If you need to format the layout of your images and videos use columns instead. Columns use the grid system provided by the Bootstrap 3 framework. This will involve adding HTML code in the Edit Source view, don’t worry it is simple and we will show you step by step how to do this. The multiple column layouts of some of the images and videos provide sample code that can be viewed and copied by selecting Edit -> Edit Source.
First let us talk about tables.
Tables
Tables are great for organising and presenting data in a structured format. Tables are made up of rows and columns where each cell can contain different types of data. They are ideal when you need to compare information, show relationships between data points, and provide a clear, visual representation of data.
Types of Tables
When creating tables you will find several options in the table properties:
Caption
- Purpose: The caption provides a title or a brief description for the table.
- When to use: It appears above the table and gives context to the table’s content.
- Example: If your table lists employee details, you might use "Employee Directory" as the caption.
Styled (Wikitable)
- Purpose: This option applies predefined styles to your table, making it look consistent and professional.
- When to use: Selecting "styled" or "wikitable" ensures your table adheres to the wiki’s standard design, which usually includes borders, background colours, and text alignment.
- Example: A table with styled (wikitable) applied will have consistent row colours and borders, making it easier to read.
Sortable
- Purpose: Allows users to sort the table data by clicking on the column headers.
- When to use: Useful for tables with data that might need to be viewed in different orders, such as sorting by name, age, or date.
- Example: In a table listing events, users could click on the "Date" header to sort events chronologically.
Collapsible
- Purpose: Makes the table collapsible, so users can hide or show the table content by clicking on a button.
- When to use: Useful for large tables or when you want to give users the option to hide the table to save space on the page.
- Example: A collapsible table with a list of all company employees allows users to hide the list if they are not interested.
Collapsed Initially
- Purpose: If a table is set to be collapsible, this option makes the table start in a collapsed state.
- When to use: Useful for tables that contain supplementary information which users might not need to see immediately.
- Example: A table with detailed statistical data can be collapsed initially to keep the page uncluttered, allowing users to expand it only if they need that information.
Tables 1, 2 and 3 below are sample tables you can copy and edit as needed. As with adding images, please consider how the table will look on screens of differing sizes.
Tables 1 and 2 are able to collapse to fit smaller screens (see Image A) and the reader will be able to scroll across to view all content, if there is too much data to fit on the screen at one time (see Image B).
Table 3 does not collapse (see Image C) so it does not work well on a smartphone, even if only a smaller number of columns and data per cell. If you come across this format on a page you are editing, please change to a smartphone-friendly format or ask another volunteer to do so.
Table 1
This table was created using the Edit tool. The biggest table size in this tool is 4x4 but once you have created the basic table, you can add more cells by copying/pasting code when in Edit Source mode.
| 1-1 | 2-1 | 3-1 | 4-1 |
|---|---|---|---|
| 1-2 | 2-2 | 3-2 | 4-2 |
| 1-3 | 2-3 | 3-3 | 4-3 |
| 1-4 | 2-4 | 3-4 | 4-4 |
Table 2
| 1st Column Heading | 2nd Column Heading | 3rd Column Heading | 4th Column Heading |
|---|---|---|---|
| 1st column 2nd row | 2nd column 2nd row | 3rd column 2nd row | 4th column 2nd row |
| 1st column 3rd row | 2nd column 3rd row | 3rd column 3rd row | 4th column 3rd row |
| 1st column 4th row | 2nd column 4th row | 3rd column 4th row | 4th column 4th row |
Table 3
| Column 1: 1st Row: xx |
Column 2: 1st Row: yy |
Column 3: 1st Row: xx |
Column 4: 1st Row: yy |
Column 5: 1st Row: xx |
| Column 1: 2nd Row: xx |
Column 2: 2nd Row: yy |
Column 3: 2nd Row: xx |
Column 4: 2nd Row: yy |
Column 5: 2nd Row: xx |
| Column 1: 3rd Row: xx |
Column 2: 3rd Row: yy |
Column 3: 3rd Row: xx |
Column 4: 3rd Row: yy |
Column 5: 3rd Row: xx |
| Column 1: 4th Row: xx |
Column 2: 4th Row: yy |
Column 3: 4th Row: xx |
Column 4: 4th Row: yy |
Column 5: 4th Row: xx |
Collapsible Tables
To create a collapsible table, you need to use specific class attributes in the table tag. Below are two examples of collapsible tables that can be sorted by column. the first table can be collapsed by clicking the blue text and the second table is already collapsed and clicking the blue text expands the table.
Note that a grey background colour has been added to the table title and the text colour changed to black by adding additional code (view in edit source to copy the code):
| Name | Age | Country | Occupation |
|---|---|---|---|
| John Doe | 30 | UK | Engineer |
| Jane Smith | 25 | USA | Designer |
| Alice Brown | 28 | Australia | Scientist |
| Name | Age | Country | Occupation |
|---|---|---|---|
| John Doe | 30 | UK | Engineer |
| Jane Smith | 25 | USA | Designer |
| Alice Brown | 28 | Australia | Scientist |
Troubleshooting Tables
Using Columns
When adding images or videos to your page you should use columns. Columns are also a great way to organise large amounts of text into columns for improved readability. You will need to add a special code to your page to use columns, don’t worry it looks daunting but it is really quite easy. To add code to your page you will need to made your edits in Edit Source mode.
Adding Images using Columns
Physiopedia Badges are awarded to people who get involved in Physiopedia and acheive the specific requirements to be awarded a badge. To see the specific requirements for each badge go to the badges page and click on each badge image to find out more information about that badge. You may only add a badge if you have received it as an award by the Physiopedia administration team. Read more about adding badges
To use wikitext you need to use the edit source option under the edit menu or the [[ ]] on the right side of the toolbar. To add the badge image which has already been uploaded to Physiopedia, first find the badge file name:
- go to the Badges page
- click on the badge you have been awarded, it will open in a new page and the name of that badge is shown at the top of the page, for example:
File:Hip Osteoarthritis.jpg
Next add this image, for example, to include an image on Hip OA 'Hip Osteoarthritis', you'd enter:
[[Image:Hip Osteoarthritis.jpg|144px]]
Which would give:
If you have been awarded multiple badges you can add them side by side. To do this you will need to use columns, like this:
<div class="row"> <div class="col-md-2"> [[Image:Hip Osteoarthritis.jpg|144px]]</div> <div class="col-md-2"> [[Image:Hip Osteoarthritis.jpg|144px]]</div> <div class="col-md-2"> [[Image:Hip Osteoarthritis.jpg|144px]]</div> <div class="col-md-2"> [[Image:Hip Osteoarthritis.jpg|144px]]</div> </div>
Which would look like this:
Adding Videos using Columns
If you wish to add two videos side by side you will need to use columns like this:
<div class="row">
<div class="col-md-6"> {{#ev:youtube|dMH0bHeiRNg|250}} </div>
<div class="col-md-6"> {{#ev:youtube|dMH0bHeiRNg|250}} </div>
</div>
Which would look like this:
Add a Reference to Your Side by Side Video
Side by Side - with references
<div class="row">
<div class="col-md-6"> {{#ev:youtube|dMH0bHeiRNg|250}} <div class="text-right"><ref>Judson Laipply. The Evolution of Dance. Available from: http://www.youtube.com/watch?v=dMH0bHeiRNg [last accessed 6/6/2009]</ref></div></div>
<div class="col-md-6"> {{#ev:youtube|dMH0bHeiRNg|250}} <div class="text-right"><ref>Judson Laipply. The Evolution of Dance. Available from: http://www.youtube.com/watch?v=dMH0bHeiRNg [last accessed 6/6/2009]</ref></div></div>
</div>
Three Side by Side - with references
<div class="row">
<div class="col-md-4"> {{#ev:youtube|dMH0bHeiRNg|250}} <div class="text-right"><ref>Judson Laipply. The Evolution of Dance. Available from: http://www.youtube.com/watch?v=dMH0bHeiRNg [last accessed 6/6/2009]</ref></div></div>
<div class="col-md-4"> {{#ev:youtube|dMH0bHeiRNg|250}} <div class="text-right"><ref>Judson Laipply. The Evolution of Dance. Available from: http://www.youtube.com/watch?v=dMH0bHeiRNg [last accessed 6/6/2009]</ref></div></div>
<div class="col-md-4"> {{#ev:youtube|dMH0bHeiRNg|250}} <div class="text-right"><ref>Judson Laipply. The Evolution of Dance. Available from: http://www.youtube.com/watch?v=dMH0bHeiRNg [last accessed 6/6/2009]</ref></div></div>
</div>
Adding Columns Using Wikitext
If you need to add responsive columns the best way to do this is by using "grids". Each grid is divided into 12 and xs (small screen); med (medium screen); lg (large screen). So to create 3 even columns on a page each column would = 4 4 4; an example of 2 large columns and one small column =5 5 2. To use columns to add images to a page see Adding Badges above.
<div class="flex-row row"> <div class="col-xs-12 col-md-6 col-lg-4">Your Column 1 Line 1 text here<br> line 2 </div> <div class="col-xs-12 col-md-6 col-lg-4">Your Column 2 Line 1 text here<br> line 2 </div> <div class="col-xs-12 col-md-6 col-lg-4">Your Column 3 Line 1 text here<br> line 2 </div> </div>
line 2
line 2
line 2
Using Columns for Text
If you want to divide your text into multiple columns to improve readability, you can use the grid system. Below is an example of how to divide your content into three columns.
<div class="flex-row row"> <div class="col-xs-12 col-md-6 col-lg-4"> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean luctus ultricies nulla, sit amet pretium justo vulputate a. Nullam et nulla eget nisl gravida congue. Praesent vitae nulla quis enim vehicula suscipit. Vivamus ultricies, purus eget aliquet cursus, elit felis luctus est, at ultricies orci ex a leo. Donec nec metus non erat pulvinar luctus. Quisque volutpat arcu non ante malesuada, ac interdum leo sollicitudin. Aenean nec ultricies felis. Suspendisse potenti. Mauris fermentum libero nec lorem dignissim, in bibendum nulla facilisis. Fusce id augue et metus tempus pharetra.</p> <p>Fusce sit amet fermentum dui, nec facilisis mi. Integer vitae justo non augue interdum luctus. Curabitur nec consequat odio, in consectetur justo. Integer ut felis id erat dignissim tempus. Aenean in sagittis ligula. Cras in quam id orci pulvinar finibus. Quisque mollis risus et tellus euismod, vel dictum est convallis. Curabitur vel ligula id justo laoreet lacinia. Nulla facilisi. Vivamus vel nunc nec quam laoreet facilisis. In hac habitasse platea dictumst.</p> </div> <div class="col-xs-12 col-md-6 col-lg-4"> <p>Aliquam erat volutpat. Curabitur efficitur lacus ac magna sollicitudin, et vehicula neque aliquam. Fusce laoreet risus vel diam dignissim, nec mollis mi ultricies. Vivamus ut eros ut risus facilisis tempor. In in faucibus ligula. Donec sagittis felis nec eros volutpat, nec scelerisque lacus laoreet. Praesent tristique, elit sit amet cursus iaculis, ligula nisi vulputate lorem, a tincidunt nunc nisi eu odio. Nulla facilisi. In hac habitasse platea dictumst. Aliquam scelerisque eros sed nunc mollis, eget dignissim ligula congue.</p> <p>Nam sed metus ac lacus ultricies volutpat. Integer dignissim lacinia neque, nec scelerisque odio sollicitudin at. Vestibulum ut sapien eget neque viverra suscipit. Vivamus fermentum efficitur dui, et convallis arcu congue at. Vestibulum quis est et urna commodo ullamcorper non nec dui. Etiam vitae convallis elit. Nulla facilisi. Phasellus nec est vel lectus fermentum viverra at et arcu. Quisque eget nulla at eros fringilla scelerisque. Vestibulum auctor erat orci, a tincidunt dui suscipit vel. Integer venenatis semper lorem, ac feugiat sapien ultricies nec.</p> </div> <div class="col-xs-12 col-md-6 col-lg-4"> <p>Suspendisse potenti. Vestibulum vehicula orci et justo venenatis cursus. Sed varius bibendum lorem, et pharetra mauris sollicitudin et. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque tincidunt, orci id sagittis aliquet, sapien lectus tempus orci, nec molestie nunc lectus ac orci. Etiam id turpis vel magna ultrices laoreet. Vivamus interdum felis eu purus dignissim, id luctus est gravida. Nulla facilisi. Proin a quam vel nunc accumsan varius. In hac habitasse platea dictumst.</p> <p>Donec suscipit, elit vel tincidunt euismod, velit purus tempus nulla, nec vehicula velit nisi nec metus. Phasellus dignissim sagittis nisl, at convallis urna dictum et. Vestibulum at cursus enim. Curabitur consequat lacus non sapien dictum, non bibendum purus laoreet. Integer tincidunt nisi velit, eget scelerisque quam tempor ut. Proin in consequat lacus. Morbi id magna nec urna vehicula feugiat. Praesent quis justo neque. Nulla non ex at ligula auctor pretium. Donec luctus erat ut arcu cursus bibendum. Vivamus facilisis nec lorem eu interdum.</p> </div> </div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean luctus ultricies nulla, sit amet pretium justo vulputate a. Nullam et nulla eget nisl gravida congue. Praesent vitae nulla quis enim vehicula suscipit. Vivamus ultricies, purus eget aliquet cursus, elit felis luctus est, at ultricies orci ex a leo. Donec nec metus non erat pulvinar luctus. Quisque volutpat arcu non ante malesuada, ac interdum leo sollicitudin. Aenean nec ultricies felis. Suspendisse potenti. Mauris fermentum libero nec lorem dignissim, in bibendum nulla facilisis. Fusce id augue et metus tempus pharetra.
Fusce sit amet fermentum dui, nec facilisis mi. Integer vitae justo non augue interdum luctus. Curabitur nec consequat odio, in consectetur justo. Integer ut felis id erat dignissim tempus. Aenean in sagittis ligula. Cras in quam id orci pulvinar finibus. Quisque mollis risus et tellus euismod, vel dictum est convallis. Curabitur vel ligula id justo laoreet lacinia. Nulla facilisi. Vivamus vel nunc nec quam laoreet facilisis. In hac habitasse platea dictumst.
Aliquam erat volutpat. Curabitur efficitur lacus ac magna sollicitudin, et vehicula neque aliquam. Fusce laoreet risus vel diam dignissim, nec mollis mi ultricies. Vivamus ut eros ut risus facilisis tempor. In in faucibus ligula. Donec sagittis felis nec eros volutpat, nec scelerisque lacus laoreet. Praesent tristique, elit sit amet cursus iaculis, ligula nisi vulputate lorem, a tincidunt nunc nisi eu odio. Nulla facilisi. In hac habitasse platea dictumst. Aliquam scelerisque eros sed nunc mollis, eget dignissim ligula congue.
Nam sed metus ac lacus ultricies volutpat. Integer dignissim lacinia neque, nec scelerisque odio sollicitudin at. Vestibulum ut sapien eget neque viverra suscipit. Vivamus fermentum efficitur dui, et convallis arcu congue at. Vestibulum quis est et urna commodo ullamcorper non nec dui. Etiam vitae convallis elit. Nulla facilisi. Phasellus nec est vel lectus fermentum viverra at et arcu. Quisque eget nulla at eros fringilla scelerisque. Vestibulum auctor erat orci, a tincidunt dui suscipit vel. Integer venenatis semper lorem, ac feugiat sapien ultricies nec.
Suspendisse potenti. Vestibulum vehicula orci et justo venenatis cursus. Sed varius bibendum lorem, et pharetra mauris sollicitudin et. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque tincidunt, orci id sagittis aliquet, sapien lectus tempus orci, nec molestie nunc lectus ac orci. Etiam id turpis vel magna ultrices laoreet. Vivamus interdum felis eu purus dignissim, id luctus est gravida. Nulla facilisi. Proin a quam vel nunc accumsan varius. In hac habitasse platea dictumst.
Donec suscipit, elit vel tincidunt euismod, velit purus tempus nulla, nec vehicula velit nisi nec metus. Phasellus dignissim sagittis nisl, at convallis urna dictum et. Vestibulum at cursus enim. Curabitur consequat lacus non sapien dictum, non bibendum purus laoreet. Integer tincidunt nisi velit, eget scelerisque quam tempor ut. Proin in consequat lacus. Morbi id magna nec urna vehicula feugiat. Praesent quis justo neque. Nulla non ex at ligula auctor pretium. Donec luctus erat ut arcu cursus bibendum. Vivamus facilisis nec lorem eu interdum.
Using Columns with Headings for Large Amounts of Text
To improve readability, you can divide your text into multiple columns using the grid system. Below is an example where each column has a header:
<div class="flex-row row"> <div class="col-xs-12 col-md-6 col-lg-4"> <h3>Column 1 Heading</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean luctus ultricies nulla, sit amet pretium justo vulputate a. Nullam et nulla eget nisl gravida congue. Praesent vitae nulla quis enim vehicula suscipit. Vivamus ultricies, purus eget aliquet cursus, elit felis luctus est, at ultricies orci ex a leo. Donec nec metus non erat pulvinar luctus. Quisque volutpat arcu non ante malesuada, ac interdum leo sollicitudin. Aenean nec ultricies felis. Suspendisse potenti. Mauris fermentum libero nec lorem dignissim, in bibendum nulla facilisis. Fusce id augue et metus tempus pharetra.</p> <p>Fusce sit amet fermentum dui, nec facilisis mi. Integer vitae justo non augue interdum luctus. Curabitur nec consequat odio, in consectetur justo. Integer ut felis id erat dignissim tempus. Aenean in sagittis ligula. Cras in quam id orci pulvinar finibus. Quisque mollis risus et tellus euismod, vel dictum est convallis. Curabitur vel ligula id justo laoreet lacinia. Nulla facilisi. Vivamus vel nunc nec quam laoreet facilisis. In hac habitasse platea dictumst.</p> </div> <div class="col-xs-12 col-md-6 col-lg-4"> <h3>Column 2 Heading</h3> <p>Aliquam erat volutpat. Curabitur efficitur lacus ac magna sollicitudin, et vehicula neque aliquam. Fusce laoreet risus vel diam dignissim, nec mollis mi ultricies. Vivamus ut eros ut risus facilisis tempor. In in faucibus ligula. Donec sagittis felis nec eros volutpat, nec scelerisque lacus laoreet. Praesent tristique, elit sit amet cursus iaculis, ligula nisi vulputate lorem, a tincidunt nunc nisi eu odio. Nulla facilisi. In hac habitasse platea dictumst. Aliquam scelerisque eros sed nunc mollis, eget dignissim ligula congue.</p> <p>Nam sed metus ac lacus ultricies volutpat. Integer dignissim lacinia neque, nec scelerisque odio sollicitudin at. Vestibulum ut sapien eget neque viverra suscipit. Vivamus fermentum efficitur dui, et convallis arcu congue at. Vestibulum quis est et urna commodo ullamcorper non nec dui. Etiam vitae convallis elit. Nulla facilisi. Phasellus nec est vel lectus fermentum viverra at et arcu. Quisque eget nulla at eros fringilla scelerisque. Vestibulum auctor erat orci, a tincidunt dui suscipit vel. Integer venenatis semper lorem, ac feugiat sapien ultricies nec.</p> </div> <div class="col-xs-12 col-md-6 col-lg-4"> <h3>Column 3 Heading</h3> <p>Suspendisse potenti. Vestibulum vehicula orci et justo venenatis cursus. Sed varius bibendum lorem, et pharetra mauris sollicitudin et. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque tincidunt, orci id sagittis aliquet, sapien lectus tempus orci, nec molestie nunc lectus ac orci. Etiam id turpis vel magna ultrices laoreet. Vivamus interdum felis eu purus dignissim, id luctus est gravida. Nulla facilisi. Proin a quam vel nunc accumsan varius. In hac habitasse platea dictumst.</p> <p>Donec suscipit, elit vel tincidunt euismod, velit purus tempus nulla, nec vehicula velit nisi nec metus. Phasellus dignissim sagittis nisl, at convallis urna dictum et. Vestibulum at cursus enim. Curabitur consequat lacus non sapien dictum, non bibendum purus laoreet. Integer tincidunt nisi velit, eget scelerisque quam tempor ut. Proin in consequat lacus. Morbi id magna nec urna vehicula feugiat. Praesent quis justo neque. Nulla non ex at ligula auctor pretium. Donec luctus erat ut arcu cursus bibendum. Vivamus facilisis nec lorem eu interdum.</p> </div> </div>
Column 1 Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean luctus ultricies nulla, sit amet pretium justo vulputate a. Nullam et nulla eget nisl gravida congue. Praesent vitae nulla quis enim vehicula suscipit. Vivamus ultricies, purus eget aliquet cursus, elit felis luctus est, at ultricies orci ex a leo. Donec nec metus non erat pulvinar luctus. Quisque volutpat arcu non ante malesuada, ac interdum leo sollicitudin. Aenean nec ultricies felis. Suspendisse potenti. Mauris fermentum libero nec lorem dignissim, in bibendum nulla facilisis. Fusce id augue et metus tempus pharetra.
Fusce sit amet fermentum dui, nec facilisis mi. Integer vitae justo non augue interdum luctus. Curabitur nec consequat odio, in consectetur justo. Integer ut felis id erat dignissim tempus. Aenean in sagittis ligula. Cras in quam id orci pulvinar finibus. Quisque mollis risus et tellus euismod, vel dictum est convallis. Curabitur vel ligula id justo laoreet lacinia. Nulla facilisi. Vivamus vel nunc nec quam laoreet facilisis. In hac habitasse platea dictumst.
Column 2 Heading
Aliquam erat volutpat. Curabitur efficitur lacus ac magna sollicitudin, et vehicula neque aliquam. Fusce laoreet risus vel diam dignissim, nec mollis mi ultricies. Vivamus ut eros ut risus facilisis tempor. In in faucibus ligula. Donec sagittis felis nec eros volutpat, nec scelerisque lacus laoreet. Praesent tristique, elit sit amet cursus iaculis, ligula nisi vulputate lorem, a tincidunt nunc nisi eu odio. Nulla facilisi. In hac habitasse platea dictumst. Aliquam scelerisque eros sed nunc mollis, eget dignissim ligula congue.
Nam sed metus ac lacus ultricies volutpat. Integer dignissim lacinia neque, nec scelerisque odio sollicitudin at. Vestibulum ut sapien eget neque viverra suscipit. Vivamus fermentum efficitur dui, et convallis arcu congue at. Vestibulum quis est et urna commodo ullamcorper non nec dui. Etiam vitae convallis elit. Nulla facilisi. Phasellus nec est vel lectus fermentum viverra at et arcu. Quisque eget nulla at eros fringilla scelerisque. Vestibulum auctor erat orci, a tincidunt dui suscipit vel. Integer venenatis semper lorem, ac feugiat sapien ultricies nec.
Column 3 Heading
Suspendisse potenti. Vestibulum vehicula orci et justo venenatis cursus. Sed varius bibendum lorem, et pharetra mauris sollicitudin et. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque tincidunt, orci id sagittis aliquet, sapien lectus tempus orci, nec molestie nunc lectus ac orci. Etiam id turpis vel magna ultrices laoreet. Vivamus interdum felis eu purus dignissim, id luctus est gravida. Nulla facilisi. Proin a quam vel nunc accumsan varius. In hac habitasse platea dictumst.
Donec suscipit, elit vel tincidunt euismod, velit purus tempus nulla, nec vehicula velit nisi nec metus. Phasellus dignissim sagittis nisl, at convallis urna dictum et. Vestibulum at cursus enim. Curabitur consequat lacus non sapien dictum, non bibendum purus laoreet. Integer tincidunt nisi velit, eget scelerisque quam tempor ut. Proin in consequat lacus. Morbi id magna nec urna vehicula feugiat. Praesent quis justo neque. Nulla non ex at ligula auctor pretium. Donec luctus erat ut arcu cursus bibendum. Vivamus facilisis nec lorem eu interdum.
Other Useful Tutorials
For more detailed information on other tutorials discussed in this guide, you can visit the following resources:
References
- ↑ Judson Laipply. The Evolution of Dance. Available from: http://www.youtube.com/watch?v=dMH0bHeiRNg [last accessed 6/6/2009]
- ↑ Judson Laipply. The Evolution of Dance. Available from: http://www.youtube.com/watch?v=dMH0bHeiRNg [last accessed 6/6/2009]
- ↑ Judson Laipply. The Evolution of Dance. Available from: http://www.youtube.com/watch?v=dMH0bHeiRNg [last accessed 6/6/2009]
- ↑ Judson Laipply. The Evolution of Dance. Available from: http://www.youtube.com/watch?v=dMH0bHeiRNg [last accessed 6/6/2009]
- ↑ Judson Laipply. The Evolution of Dance. Available from: http://www.youtube.com/watch?v=dMH0bHeiRNg [last accessed 6/6/2009]


