Skip to content

mate-academy/layout_style-it-up

Repository files navigation

Style it up

  1. Replace <your_account> with your Github username in the links
  2. Follow this instructions

The task

Please DO NOT change index.html though. Change style.css so the page works as described below:

  • The page consists of a header, a footer, and 9 blocks between them.
  • The width of the blocks must be 300px.
  • The height of each of the blocks (including both header and footer) has to be 100px.
  • When hovered, the block height must increase to 200px.
  • Please use these colors:
    • header is blue
    • footer is black
    • important is red
    • interesting is green
    • surprising is orange
  • There should be no vertical spacing between the blocks and the edges of the page.
  • Place the blocks so that they are horizontally centered on the page.