Grid Puzzle

One

Two

Three

Four

Five

Six

Flexbox Game

The below game is from https://flexboxfroggy.com/. Have fun with it!

Card Content

Add containers inside the card to create different sections:

Header

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Button Borders

Note

London is the most populous city in the United Kingdom, with a metropolitan area of over 9 million inhabitants.

Inputs

First Name

Last Name

Useful References

CSS Libraries

CSS Libraries is ready to go code that helps you format a page. Some top libraries are:

Bootstrap
Tailwind css
W3.css
Foundation
Bulma
Skeleton

How to import a css library

There are 2 ways you can reference a CSS library in your code

Absolute

link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"

Relative

link rel="stylesheet" href="w3.css"

How to use a library

Every CSS library has documentation and a “Getting Started” page

Tailwind Css: https://tailwindcss.com/docs/installation

W3.css: https://www.w3schools.com/w3css/w3css_references.asp

Bootstrap: https://getbootstrap.com/docs/3.4/css/