You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Kristyn Bryan
c635c2b222
|
10 years ago | |
|---|---|---|
| .. | ||
| css | 10 years ago | |
| images | 10 years ago | |
| README.md | 10 years ago | |
| index.html | 10 years ago | |
| mockup.png | 10 years ago | |
README.md
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-blockto 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
