CSS3 Flexbox - Mastering the Basics

Offered By
Coursera Project Network
In this Guided Project, you will:

Learn Flexbox and Flexbox Layout

Understand Flexbox Container Properties

Understand Flexbox Item Properties

Clock1.5 hours
IntermediateIntermediate
CloudNo download needed
VideoSplit-screen video
Comment DotsEnglish
LaptopDesktop only

This project will teach you easy and simple examples on Flexbox properties so that one can understand and master the basics of Flexbox so that these can be applied in building modern web layouts in Front End part of the Web application process. This project covers all Flexbox properties like Flexbox Container Properties and Flexbox Item Properties. Note: This course works best for learners who are based in the North America region. We’re currently working on providing the same experience in other regions.

Skills you will develop

Front End Web ApplicationCascading Style Sheets (CCS)Flexbox BasicsCSS3 Flexbox

Learn step-by-step

In a video that plays in a split-screen with your work area, your instructor will walk you through these steps:

  1. Introduction to Flexbox, and Flexbox Layout

  2. Flexbox Container Properties 1 - Basic HTML Code, Flexbox display property 

  3. Flexbox Container Properties 2 - flex-direction,flex-wrap and flex-flow

  4. Flex Container Properties 3 - justify content, align item and align content

  5. Flex Items Properties 1 - order, flex-grow and flex-shrink

  6. Flex Items Properties 2 - flex-basis , align-self and flex

How Guided Projects work

Your workspace is a cloud desktop right in your browser, no download required

In a split-screen video, your instructor guides you step-by-step

Frequently asked questions

Frequently Asked Questions

More questions? Visit the Learner Help Center.