HTML Layout

Everywhere on the Web you will find pages that are formatted like newspaper pages using HTML columns.

HTML Layout—Using Tables
One very common practice with HTML, is to use HTML tables to format the layout of an HTML page. A part of this page is formatted with two columns, like a newspaper page. As you can see at this page, there is a left column and a right column. This text is displayed in the left column.   An HTML <table> is used to divide a part of this Web page into two columns. The trick is to use a table without borders, and maybe a little extra cell-padding. No matter how much text you add to this page, it will stay inside its column borders.

Same Layout—Color Added
One very common practice with HTML, is to use HTML tables to format the layout of an HTML page. A part of this page is formatted with two columns, like a newspaper page. As you can see at this page, there is a left column and a right column.   An HTML <table> is used to divide a part of this Web page into two columns. This text is displayed in the right column. The trick is to use a table without borders, and maybe a little extra cell-padding. No matter how much text you add to this page, it will stay inside its column borders.

Images—Without Using Tables
This example shows the text is followed by an image. It is not a good display because an image is ususally larger than a line.

Images—Using Tables
This example uses a table to put the text and image at the same line. The table is without a border and with two columns and one row. 		 


Demonstration
The following demonstration shows how the HTML script is displayed on the Web.