CoderTools Web site

HTML Table - colspan, rowspan

Description - colspan

Most of the time the tables you need to create will not be neat and tidy and and consist of an even number of columns and rows. This is especially true when using tables for layout purposes.

This is no problem once you understand the colspan attribute of the <td> - which is the html table column element.

Examples - colspan

Here is an example where the middle row spans 3 columns, so colspan="3":

1 1 1
3 3 3

Here is the code:

There is a couple of things to note here:
  • <style> - You're probably thinking what the hell is this <style> and border-xxx business. Well its C.S.S. or Cascading Style Sheets. Its used here to add a border around the table cells and the table itself. I did not want to start showing you C.S.S. just yet, but the border really helps emphasise colspan, cellpadding and cellspacing. see the css tutorial for more
  • cellpadding - this is used to add space around the inner content of table cells.
  • cellspacing - this is used to add space around the table cells.


1 1 1
2 2
12/16/2017 8:56:11 AM
Terms Of Use | Privacy Statement | Copyright 2006-2015 © Independence Software LLP