Code Challenge – Week of November 23, 2020
Recreate the below magazine layout using Semantic HTML and CSS Flexbox
Challenge Rules:
- You must use Semantic HTML and CSS Flexbox
- You may choose your own font and background image
- Originality and readability of your code (make it your own and use style conventions and comments to keep things legible).
Deadline for prize submission:
- December 7th at 11:59 pm
Prize: A forum badge that recognizes you as a code challenge winner & 1 month of Pro for free.
- The winner will be who presents the most similar outcome (magazine layout) compared to the original layout. If there’s a draw on similarity, the contestant who used the fewest characters in their code will be the winner. We don’t count spaces and end-lines as characters.
Resources:
- Semantic HTML (lesson)
- Layout with Flexbox (lesson)
- MDN web docs: Flexbox
- Flexbox Froggy
- Repl.it (For those not using GitHub, code your project on Repl.it, run it and see the outcome of your code)
Once you’re done…
- Share it in a post below. Take a screenshot of your finished project in a browser and include a link to your GitHub gist or Repl.it link so we can see your code.