Intro to CSS Practice

Imperfect Foods Comp Recreation

You will be recreating a piece of this site. Scroll down to the section titled "How to Shop Imperfect Foods."

The Comp:

Set Up Instructions

1. Fork and clone this repo
2. cd into the directory
3. Run open index.html to view your app in the browser

Instructions

Some notes:

• The HTML is already there for you, but feel free to change that file as you wish (add elements, add IDs or classes, etc).
• The CSS file has the font and colors listed for you. You do not need to import anything for the font, we've done that for you (HTML line 5).
• Don't worry about the worn design in the background. We will just make the background one solid color.

Iteration 1 (after CSS: Fundamentals lesson):

• Do not worry about the layout (where elements are on the page) yet! We'll get to that after your Flexbox lesson.
• Make the text match the font and sizing from the comp
• Make the colors match the comp
• Make the image sizes match the comp
• Style the button to match the comp

Iteration 2 (after CSS: Flexbox lesson):

• Use flexbox to make the layout match the comp (hint: you may need to add container elements to your HTML to group the img, h2, and p elements)