Creating Tables in HTML ( Part 2 )
Lessons Covered


In this part 2 section we continue with the lesson on tables and learn of some more useful table attributes.


The Cellspacing Attribute

The cellspacing attribute is used to specify the amount of space between each of the cells within a table. This value is specified in pixels.

Applying the cellspacing attribute:

<table border="2" cellspacing="40">
<tr>
<td> Apples  </td>
<td> Bananas </td>
</tr>
</table>

right arrow  Click to see result


The Cellpadding Attribute

The cellpadding attribute sets the space between the text and the border of each cell.

Applying the cellpadding attribute:

<table border="2" cellpadding="40">
<tr>
<td> Apples  </td>
<td> Bananas </td>
</tr>
</table>

right arrow  Click to see result


The Rowspan and Colspan Attribute

The rowspan and colspan attributes are responsible for merging data cells within a table. Rowspan merges rows as you might have guessed while colspan merges columns.

Example:


<table border="2" cellspacing="0" cellpadding="10">
	<tr>
	
	    <th rowspan="2"> WELCOME             </th>
	    <th colspan="3"> School Information  </th>

	</tr>
	
	<tr>
	
	   <th> Location </th>
	   <th> Address ( Main Campus ) </th>
	   <th> Number/s </th>
	
	</tr>
</table>

right arrow  Click to see result

Looking at the table what do you notice ? The left section which has the text "welcome" occupies two rows. Also looking at the table you will notice the heading "School Information" occupies three columns. This is rowspan and colspan at work. You can apply these attributes to the table data tag as well. The other headings (location, address and number/s) in the example do not have any colspan or rowspan attribute applied and are thus displayed normal.


Thats it for part 2 on tables ! The final lesson to be covered is forms. Lets Go ! Click the next lesson link below to start your lesson on forms.


    Previous Lesson Previous Lesson - Tables (Part 1)                                         Next Lesson - Forms Next Lesson