Campsite Coders

Learn CSS

Learn to code and become a Front End Web Developer

Campsite Coders Bootcamp Coding Advenuture

CSS Flexbox

CSS FlexBox is a layout model for one-dimensional layouts. You can choose to place items either along the X-axis or the Y-axis (but not both). A flex container is flexible meaning it expands the items to fill space when it is available and shrinks the space when it is not. With Flexbox, you can lay out and align elements in a container even if you don’t know the size of those items.

NOTE: You can put a FlexBox container inside of a CSS Grid but you cannot put a CSS Grid inside of a FlexBox container.

CSS Grid System

How to Create a CSS Flexbox

HTML

html code for flexbox

CSS

css code for flexbox

RESULTS

Try creating a web page with a CSS Flexbox. Spend at least one hour on this topic because CSS flexbox is used quite often in web design so you need to be confident on this topic.

If you read the information above and reviewed and understand the demos then you have completed the CSS 3 mountain climb at Campsite Coders. Take a break and when you are ready to move forward, you can start learning JavaScript.

Congratulations! You have completed the CSS training.

Campsite Coders Bootcamp Coding Adventure
Road Map for Coding Adventure One

Campsite Coders

56747 Ewing Rd

Moffat, CO 81143

720-515-1124

Campsite Coders logo in footer

Copyright 2023 . All rights reserved