Lay it on the Table

Tables are rectangular boundaries made up of rows and columns, which create variable rectangles called cells. By placing your content into these calls, you can control its position and dimension.
To place a table, set your cursor on a new line and click the Insert Table icon in your editor.

In the Table Properties window, You will see the following options:
 

ROWS -  Rows hold lines of one or more horizontal cells. The widths of each row cell are determined by the overall width of the table and can be set in pixels or percentage. If a table is 500 pixels wide, the width of the cells and cell spaces, when added together, can not exceed 500 pixels. The tallest cell in the row, which is determined by the cells content, determines a rows height.
COLUMNS - A column is a line of one or more vertical table cells. A column will be as wide as the widest cell in the column.
 

BORDER – Border size can be set from 0 – 99. A setting of 0 will hide the lines of the table in live view but will be visible to you in the editor so you can arrange content cleanly on your page but without the grid lines. While 99 is the biggest number you can put into the border size window it is enormous and not practical. Ideally set the size to any number under 20. This will determine the thickness of the border and add normal lines for the table cells.

ALIGNMENT (Left, Centre, Right) – Sets the position of your table on the page.
CAPTION – Inserts a title for your table, centred and above.
WIDTH – Set a specific pixel size or choose a percentage of your page width.
CELL SPACING - Cell spacing is the space between cells.
CELL PADDING - Cell padding is space between the cell wall and the content within the cell.

The first step is to select the number of rows and columns you need. If you’re not sure, don’t worry you can always go back to add or remove them as required by right clicking your table (click on the background of the table not the content).

Right clicking your table also provides the following options:
Cut, Copy, Paste.
Cell – allows you to insert cells before and after and delete cells. Merge cells to the right or down. Split cells horizontally and vertically. Alter the cell properties including Width and Height, word wrap (behaviour of text within cells), Horizontal and Vertical Alignment of content, Row and Column span, Background colour and border colour of each cell selected (select all cells to change colours on whole table).
Row and Column - insert before and after and delete.

Top Tips

When placing images in cells, I always find it easier to centre align them all. This can also help when placing text under or above images such as titles or descriptions as when the text is also centred, everything lines up cleanly.

If you choose to have an invisible table, extra rows in between content can help to space the content out nicely.

You can also add background colour to these rows to create neat divider lines. 
 

You will need to do some maths when setting the widths and heights of both tables and individual cells. 
 

Tables within tables should be used carefully or better still avoided as “Nesting tables” as they are called, can create excessive and complicated HTML code, which can make your web page slow to load and could cause errors on your page.

We'd love these blog pages to become a handy forum for all DotGO Web Builders, so please add your comments or questions and let's get chatting!!

Find out more about us

We have been in business since 2003. Back when the founders of Facebook were still in college, we were writing code and helping our users create great websites.

Affordable business website design

If you need help, why not check out our huge selection of videos, step-by-step guides and knowledge papers.

UKs most trusted

We have helped many thousands of our customers create great looking websites. Take a look at a few examples, created using our website builder.