Creating the Web Pages - HTML5 Foundations - page 83

5. Locate the <section> element with the ID page-text and delete any content that is in this element.
6. Create a new <h1> element in this section and give it the text Menu .
7. Underneath this <h1> element, create a new <div> element with the ID menu-tables . This will be
used to group all the menu tables together for styling purposes.
8. Within this new <div> , create three empty <section> elements. These will hold the three parts of the
menu.
9. In the first <section> element, create a new <h1> with the text Pizzas .
10. Copy the following <table> underneath this heading. This table uses three columns. One for the name of
the dish, one for a description of the dish, and one for the price. Each dish is presented on its own row.
<table id="pizzas">
<thead>
<tr>
<th>Menu Item</th>
<th>Description</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>Joe's Pepperoni Special</td>
<td>
Select pepperoni with our signature spicy tomato sauce
</td>
<td>13.00</td>
</tr>
<tr>
<td>Margherita</td>
<td>Oregano, mozzarella and tomato</td>
<td>10.50</td>
</tr>
<tr>
<td>Hawaiian</td>
<td>Ham and Pineapple</td>
<td>12.00</td>
</tr>
<tr>
<td>Pollo</td>
<td>Chicken and Roast Peppers</td>
<td>12.00</td>
</tr>
<tr>
<td>Mexican Chicken</td>
<td>Spicy Chicken with jalapenos</td>
<td>12.50</td>
</tr>
</tbody>
</table>
11. In the second <section> element, create a new <h1> with the text Garlic Breads .