Exercises with tables

  1. Visit the Yale Web Style Guide Sections on:

  2. Create an annotated list of links using tables to constrain text to a width of 500 pixels or so. Use tables for other fancy formatting if you like.

  3. Use tables to recreate the "driftworms" seen on the handout. Use this page to harvest the images and text.

  4. For an extra challenge, try recreating the ESPN basketball story. Use this page to harvest the images and text.

Tips:

  • watch for the effects of spaces and carriage returns between tags
  • try BGCOLOR=somehex to change the background color of data cells
  • don't forget to try out ALIGN=LEFT, RIGHT, or CENTER attributes with different tags
  • in data cells, you can also try to adjust vertical alignment with VALIGN=TOP, BOTTOM or MIDDLE
  • its OK to nest tables--just be sure to keep track of which tags go with which tables. Try using comments.
  • remember to account for all columns in each row
  • play around with the WIDTH= attribute in the TABLE and TD tags. Remember that the width can equal pixels (WIDTH="250"), or percentages (WIDTH="50%").
  • pay attention to the BORDER, CELLSPACING, and CELLPADDING attributes.