# WDI-PANTHALASSA
---
Title: CSS Homework - Brook & Lyn
Type: Homework
Duration: "1:00 - 3:00"
Creator:
Adapted from: WDI NYC Funke Cohort & WDI NYC Archer Cohort
Adapted by: Kristyn Bryan
Course: WDIr Panthalassa
Competencies: HTML, CSS, inline-block
Prerequisites: Basic HTML & CSS
---
## Brook & Lyn: A layout exercise
The website of fashion brand Brook & Lyn has a simple layout. The visual elements live within a centered container, and the bottom row is laid out in the inline style.
#### Exercise Objectives
- gain meaningful experience using html & css skills to build a complete layout
- gain meaningful experience centering a container div
- gain meaningful repetitions using `inline-block` to lay out a list of elements in a row
#### Directions
- Use the attached code and images to write the html and css necessary to recreate the layout seen below.
- Add the HTML image links into your CSS to display all of the images in the layout (they won't be in order yet, just get them to show up on your page).
**Commit 1**
The commit message should read:
"Added image links to html"
- Play around with the CSS of the images to move them into place to look like the mockup.
**Commit 2**
The commit message should read:
"Moved images to match mockup"
- Change the font, font size, and color to match the style in the mockup.
**Commit 3**
The commit message should read:
"Adjusted font, font size, and color"
- Take a screenshot of your mockup
- Save the file inside your Brook & Lyn folder
**Commit 4**
The commit message should read:
"uploading a screenshot of my Brook & Lyn homework"
#### Layout
