This exercise is for you if you want to review how to use the grid display property, as well as to use the mobile-first authoring method effectively.
If you have not used grid before, it would be better for you to do the step-by-step version of this exercise: it will take you through building this layout, including the HTML markup.
First of all, please download the files you need for this exercise, unzip them and then open the project up in your code editor.
This exercise starts with almost all the markup complete. There is also some CSS already added to the stylesheet.
Now please watch the following videos in the order implied by their titles, coding along and completing the layout as it’s completed in the videos. Just add your CSS to the style.css file. If any more HTML is needed, feel free to add it.
- Grid Review Guitar Mania 1: Small
- Grid Review Guitar Mania 2: Medium
- Grid Review GuitarMania 3: Large
- Grid Review GuitarMania 4: Extra-Large
- Grid Review GuitarMania 5: Submit Box Width Fix
When done, please rename the folder yourname-guitarmania, then zip it, and hand it in.
Incorrectly named folders will be penalized 25%.