#one { background-color: #900; }
#one { background-color: #900; float: left; width: 50% }
#two { background-color: #0f0; margin-left: 50%; }
#one { background-color: #900; float: left; width: 33%; }
#two { background-color: #0f0; float: left; width: 33%; }
#three { background-color:#ff6600; margin-left: 66%; }
#one { background-color: #900; float: left; width: 33%; }
#two { background-color: #0f0; float: right; width: 33%; }
#three { background-color:#ff6600; margin: 0 33%; }
Special note for for IE: you can use the fix from here to correct the 3px "jog" that causes the odd white-space. Since all this code is inline, I can't.
People don't seem to trully understand that these techniques are generally applicable to ALL types of elements. Here is a three column example using a list.
ul, li { list-style: none; margin: 0; padding: 0; }
li#one, li#two { float: left; width: 33%; background-color: #900; }
li#two { background-color: #0f0; }
li#three { background-color: #f60; }