Chapter 9, Lesson 4

If you already know how to align the caption to the top and bottom of a simple table, you can skip this lesson.

In a previous lesson, we learned that the 'CAPTION' tag can be used within a table to designate text for the table's title (coincidentally called a "caption"). The browser will align the caption to the top or the bottom of the table if you explicitly use the 'ALIGN=" attribute inside the <CAPTION> tag. To align the caption, use one of the following methods:

<CAPTION ALIGN="TOP"> (place the caption at the top of the table)
<CAPTION ALIGN="BOTTOM"> (place the caption at the bottom of the table)

Naturally, you should follow the usual rules about using attributes in HTML tags, like using a space before the attribute name, but no spaces around the '=' sign or after the first quotation mark. And in this case, use quotation marks around the attribute's value, as shown.

Some browsers support additional values for the 'ALIGN' attribute for aligning left, right, and center; some also support a 'VALIGN' attribute for top and bottom. I don't recommend using these because they haven't come into widespread usage, and you can get some unexpected results with some browsers.

Let's look at some source code, for demonstration purposes:

<TABLE>
<CAPTION><U>Class Attendance</U></CAPTION>
<TR><TH>Class <TH>Jan-Mar <TH>Apr-Jun <TH>Jul-Sep <TH>Oct-Dec </TR>
<TR><TD>Intro to Internet <TD>14 <TD>26 <TD>29 <TD>28 </TR>
<TR><TD>Building Your Web Page <TD>26 <TD>25 <TD>28 <TD>30 </TR>
</TABLE>
<P>
Here's a table with 'BOTTOM' caption placement:
<P>
<TABLE>
<CAPTION  ALIGN="BOTTOM"><U>Class Attendance</U></CAPTION>
<TR><TH>Class <TH>Jan-Mar <TH>Apr-Jun <TH>Jul-Sep <TH>Oct-Dec </TR>
<TR><TD>Intro to Internet <TD>14 <TD>26 <TD>29 <TD>28 </TR>
<TR><TD>Building Your Web Page <TD>26 <TD>25 <TD>28 <TD>30 </TR>
</TABLE>
<P>
Here's a table with <I>explicit</I> 'TOP' caption placement:
<P>
<TABLE>
<CAPTION  ALIGN="TOP"><U>Class Attendance</U></CAPTION>
<TR><TH>Class <TH>Jan-Mar <TH>Apr-Jun <TH>Jul-Sep <TH>Oct-Dec </TR>
<TR><TD>Intro to Internet <TD>14 <TD>26 <TD>29 <TD>28 </TR>
<TR><TD>Building Your Web Page <TD>26 <TD>25 <TD>28 <TD>30 </TR>
</TABLE>

Here's a table with default alignments (caption centered and on top):

Class Attendance

Class	Jan-Mar	Apr-Jun	Jul-Sep	Oct-Dec
Intro to Internet	14	26	29	28
Building Your Web Page	26	25	28	30

Here's a table with 'BOTTOM' caption placement:

Class Attendance

Class	Jan-Mar	Apr-Jun	Jul-Sep	Oct-Dec
Intro to Internet	14	26	29	28
Building Your Web Page	26	25	28	30

Here's a table with explicit 'TOP' caption placement:

Class Attendance

Class	Jan-Mar	Apr-Jun	Jul-Sep	Oct-Dec
Intro to Internet	14	26	29	28
Building Your Web Page	26	25	28	30

---

Overseer: Monty Northrup ... ... leave e-mail ...

---