Tables - Web Development and Design Foundations with XHTML - page 345

Figure 8.32
Menu page with
table
Hands-On Practice Case
1. Configure the CSS. Modify the external style sheet, javajam.css. Review Figure 8.32
and note the menu descriptions, which are coded in an XHTML table. Add style
rules to the javajam.css external style sheet to configure a table that is centered,
td and th selectors with 10 pixels of padding, and displays a background color of
#ccaa66 in alternate rows (use a class). Save the javajam.css file.
2. Modify the Menu Page. Edit the Menu file (menu.html) in Notepad. The menu
descriptions are configured with a definition list. Replace the definition list with a
table that has three rows and two columns. Use <th> and <td> elements where
appropriate.
Save your page and test it in a browser. If the page does not display as you intended,
review your work, validate the CSS, validate the XHTML, modify as needed, and test
again.
Fish Creek Animal Hospital
See Chapter 2 for an introduction to the Fish Creek Animal Hospital Case Study. Figure
2.30 shows a site map for Fish Creek. The pages were created in earlier chapters. You
will use the existing Web site in the fishcreekcss folder (unless your instructor specifies
otherwise). You will modify the services page (services.html) to display information in
an XHTML table. You will use CSS to style the table. You have two tasks:
1. Add style rules to the fishcreek.css file that will configure the new table.
2. Modify the Services page (services.html) to use a table to display information.
Refer to Figure 8.33.