HTML Tutorial: Tables
 
 

The Planets

Earth Mercury Venus
Jupiter Mars Uranus
Saturn Pluto Neptune

Those of you interested in planets will have realised that our previous tables were incomplete!

There are 9 planets in total, so to include them in our table I've had to add an extra row and and an extra column, giving a 3 x 3 table!

The best way to do this is to use a web authoring tool - editing the HTML directly is a fiddly job. But if you had to do it manually - here's how to go about it.

Right now each row in your table has 2 columns - so there will be 2 <TD> and </TD> tags within each pair of <TR> and </TR> tags.

You've probably sussed it... to add a column you simply need to add another pair of <TD>, <./TD> tags.

<TR>
    <TD>blah blah blah </TD>
    <TD>blah blah blah </TD>
    TD>blah blah blah </TD>
</TR>

And then you need to add another row - probably the easiest way to do this is to copy and paste an existing row, i.e. everything between (and including) one set of <TR> and </TR>  tags, and then change the text.

Here's what the final code looks like:

<TABLE BORDERCOLOR="pink" BORDER="5" CELLSPACING="10"  CELLPADDING="10">
  <TR>
    <TD ALIGN="CENTER">Earth</TD>
    <TD ALIGN="CENTER">Mercury</TD>
    <TD ALIGN="CENTER">Venus</TD>
  </TR>
  <TR>
    <TD ALIGN="CENTER">Jupiter</TD>
    <TD ALIGN="CENTER">Mars</TD>
    <TD ALIGN="CENTER">Uranus</TD>
  </TR>
  <TR>
    <TD ALIGN="CENTER">Saturn</TD>
    <TD ALIGN="CENTER">Pluto</TD>
    <TD ALIGN="CENTER">Neptune</TD>
  </TR>
</TABLE>

Try it out yourself in the box below: