CSS Assessment

Before continuing with the lessons go ahead and attempt the following assessment. These will be a good way to test your understanding of the knowledge you just gained.

Instructions

Attempt to complete all of the goals below.

Goals:

  • Create a new folder in your prework repo titled CSS_Assessment
  • Create a new application (index.html and style.css) in the new folder and ensure that you link properly.
  • Create a navigation bar (a box that spans the width of the browser and sits only at the top of the page).
  • Create another two boxes below the navigation bar. The first box should take up 1/2 of the width of the browser. Add the text, "Left" inside of this box and ensure that the text is aligned in the center horizontally and vertically.
  • The second box should take up 1/4th of the width of the browser and align right. Add the text, "Right" inside of this box and ensure that the text is aligned in the center horizontally and vertically.
  • Create a footer bar (a box that spans the width of the browser and sits at the bottom of the page).
  • Make sure that your footer is at the bottom of the page
  • Your page should match the below image as closely as possible.
  • Remember to include a reset.css file in all your pages.

  • Push the completed files to the repository on GitHub

  • Remember, you will need to send a link to your github repository to [email protected]!