Lorem ipsum dolor sit amet, dolores maiestatis sed te, sint similique te vim. Dicam luptatum sapientem qui cu, ei prompta utroque efficiendi eam. Cu mei omnis oporteat pertinax, ei duis veniam propriae mea. Et alia recteque efficiendi mea. Pri at velit falli inteasdfasdfasdfllegebat, ut vix munere electram.

On the right hand side you'll see a lightning bolt. Click the lightning bolt to open the layout tools. You'll see there are 3 types of structural elements. 

1. Columns - these are the smallest unit. Elements stack vertically within columns. This text box, and the picture below it are both within the same column.
   
   
2. Rows - rows contain columns, and stay centered within the screen. The row containing this column is green and contains two columns. You can find its drag bar and settings cog to the right when hover over it.
   
   
3. Sections - Sections extend from edge to edge, and contain rows.

Structural elements sort among like elements. In other words, columns sort among other columns, rows sort among other rows, and sections sort among other sections.

You add structural elements just like you'd add anything else. Drag it from the layout tray onto the page. The number dial next to the element indicates how many columns you'll be adding within that element. So if you chose a row with 3 columns, it would add a row with 3 column preloaded. Adding a section also adds a row with as many columns as you indicated.

Note: You can't add columns directly into sections.  Play around with it and see how it works. 

Fooo bar

When you're ready to view your page, click the wrench icon in the upper left hand corner, then select "Preview Page". There are two ways to view this page. 

1. Preview Page - Preview the unpublished version you're working on. This will reflect the changes you've made on this screen.
   
   
2. Preview Live Version - This will allow you to view the version of the page that is currently published. You won't see any of the changes you just made because you haven't published your changes yet.

Once you're ready to publish, go ahead and click "publish wizard". This will walk you through the setup for declaring the facebook metadata and google snippets. If you don't want to go through that setup again and just want to publish, click "quick publish".

Delete this whole column by dragging it into the trash can. See what happens. The drag bar is a little shield symbol at the top of the column when you hover over it.

You can sort columns too. If you hover above the column you'll see a drag bar and a settings cog. Rearranging columns is very easy in Leiout. Try it!

Elements fill up 100% of the width of their columns. Move the image above out of this column so that it's in the same column as the heading above (the nature of elements). You'll see it takes up all the space available.