<html> <head> <style> table { width: 400px; height: 25px; } td.blue { background: lightblue; } td.green { background: lightgreen; } td.skinny { width: 100px } td.medium { width: 200px } td.wide { width: 300px } </style> </head> <body> With colspan: <table cellspacing=0 cellpadding=0> <tbody><tr> <td class="blue skinny"></td> <td class="green wide"></td> </tr></tbody> </table> <table cellspacing=0 cellpadding=0> <tbody><tr> <td class="blue skinny"></td> <td class="green wide"></td> </tr></tbody> </table> <table cellspacing=0 cellpadding=0> <tbody><tr> <td class="blue skinny"></td> <td class="green wide"></td> </tr></tbody> </table> <table cellspacing=0 cellpadding=0> <tbody><tr> <td class="blue skinny"></td> <td class="green wide"></td> </tr></tbody> </table> Without colspan: <table cellspacing=0 cellpadding=0> <tbody><tr> <td class="blue skinny"></td> <td class="green wide"></td> </tr></tbody> </table> <table cellspacing=0 cellpadding=0> <tbody><tr> <td class="blue skinny"></td> <td class="green wide"></td> </tr></tbody> </table> <table cellspacing=0 cellpadding=0> <tbody><tr> <td class="blue skinny"></td> <td class="green wide"></td> </tr></tbody> </table> <table cellspacing=0 cellpadding=0> <tbody><tr> <td class="blue skinny"></td> <td class="green wide"></td> </tr></tbody> </table> <table cellspacing=0 cellpadding=0> <tbody><tr> <td class="blue skinny"></td> <td class="green wide"></td> </tr></tbody> </table> <table cellspacing=0 cellpadding=0> <tbody><tr> <td class="blue skinny"></td> <td class="green wide"></td> </tr></tbody> </table> <table cellspacing=0 cellpadding=0> <tbody><tr> <td class="blue skinny"></td> <td class="green wide"></td> </tr></tbody> </table> <table cellspacing=0 cellpadding=0> <tbody><tr> <td class="blue skinny"></td> <td class="green wide"></td> </tr></tbody> </table> </body> </html>