Tools:

Tables for Tabular Data

Tables are great for tabular data. Nothing else, nothing more. Unfortunately, tables are often mis-handled and overly used resulting in pages that become very difficult and frustrating to maintain.

Creating a Table is Simple and Easy

We can see a table below that contains four (4) columns x four (4) rows. We have a "header" row with bold titles, then there are alternating lighter rows.

It's crucial to understand that each row must have the same amount of TD tags as all the other rows -- otherwise the table will not form as we intend.


PLEASE NOTE: The number of columns per row is based on the number of sets of <TD> tags contained between each set of <TR> tags. Viewing the sample code below and you will see 4 sets of <TD> tags for each set of <TR>

Sample Table with Placeholder Content:
Title 1
Title 2
Title 3
Title 4
Row 1, Column 1 Row 1, Column 2 Row 1, Column 3 Row 1, Column 4
Row 2, Column 1 Row 2, Column 2 Row 2, Column 3 Row 2, Column 4
Row 3, Column 1 Row 3, Column 2 Row 3, Column 3 Row 3, Column 4
Row 4, Column 1 Row 4, Column 2 Row 4, Column 3 Row 4, Column 4
Copy/Paste and then Insert Your Content:
<!-- START (your comment) TABLE -->

<table class="striped" cellpadding="0" cellspacing="0" summary="design purposes">
<tr class="header">
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>

<!-- END (your comment) TABLE -->

Search This Website

To search only the Information Technology Services website, enter text in the box below, then click 'Search'.

Upcoming Training Opportunities

Contact Us

  • Web Services
  • Prescott Campus, Building 6
  • Monday-Friday, 8am - 5pm
  • Tel: (928) 717-7711
  • Fax: (928) 776-2054
  • webservices@yc.edu