HTML Layout

Websites often display content in multiple columns (like a magazine or newspaper).

HTML5 offers several semantic elements that define the different parts of a web page:

Layout

HTML Layout Techniques

There are five diferrent ways to create multicolumn layouts.

Each way has its pros and cons:

So Which One to Choose?

The table element was not designed to be a layout tool! The purpose of the table element is to display tabular data. So, do not use tables for your page layout! They will bring a mess into your code. And imagine how hard it will be to redesign your site after a couple of months.

CSS Floats

It is common to do entire web layouts using the CSS float property. Float is easy to learn - you just need to remember how the float and clear properties work. Disadvantages: Floating elements are tied to the document flow, which may harm the flexibility.