Task 9 – Footers & Menus

Portfolio

  1. Update any post content or page content as you continue customizing your portfolio–specify any changes made in your post.
  2. Update Header
  3. Complete Footer
  4. Create additional menu(s) for use elsewhere on your website–post URL
  5. Set up additional pages:  About Me page, Portfolio/Works page & Contact page (with menu items & minimal content).
  6. Confirm Contact form works (ask classmate to try your form & screenshot it & add to your post)

HTML/CSS Practice

W3S

  1. Quiz 9

CodePen

Add the following code to your CCS stylesheet in Codepen– Note what the CSS changes in your website.


#navigation {
/* 29. Expand the menu to stretch horizontally across the page. */
width: 100%;
/* 30. Set the menu to stay at the top when the user scrolls down the page. */
position: fixed;
top: 0;
/* 31. Position the menu to cover underlying content. */
z-index: 2;
/* 32. Space the menu items evenly with gaps on either end. */
display: flex;
justify-content: space-around;
/* 33. Give the menu links some breathing room. */
padding: 1em;
}
#logo {
/* 34. Adjust the logo size. */
font-size: 1.3em;
}

Post

  1. Subject: Task 9-yourname
  2. Category: Task 9
  3. Codepen URL
  4. Portfolio URL as a clickable link
  5. Screenshot of Contact form email sent to you by classmate.
  6. Description of any significant changes/updates you have made to content, layout styling.