Workbook 2.9

Task 1

Link each template to the stylesheet.

Task 2

Inside both documents:

• assign the div containing the <a> tags to the CSS class topnav.
• assign the div containing the <h1> to the class container.

Task 3

• The HOME button must make a GET request to the relative path /.
• The AWAY button must make a GET request to the relative path /away.

Task 4

The CSS class active colors a button green. Assign each button the active class depending on which webpage is being displayed.

   <!--away-->

     <div class="topnav">
         <a th:href="@{/}">Home</a>
         <a th:href="@{/away}" class="active">Away</a>
     </div>

   <!--home-->

     <div class="topnav">
         <a th:href="@{/}" class="active">Home</a>
         <a th:href="@{/away}">Away</a>
     </div>

Toggle between the buttons.

Test Case: Home page

Test Case: Away page

Good Luck!