Bite-Sized CSS Flexbox

Course

Online

Price on request

Description

  • Type

    Course

  • Methodology

    Online

  • Start date

    Different dates available

Enhance your frontend, responsive web development skills by learning CSS Flexible Box Layout.  More often referred to as CSS Flexbox, this one-dimensional, web layout model enables you to easily create dynamic layouts with elements that automatically resize, move, and more based on the device’s screen size.  This course will show you how to utilize numerous aspects of CSS Flexbox – such as multiple column layouts, element positioning, and more – to build your own, professional-looking webpage with core skills perfect for many different web development projects.

You will learn how to:

Understand the core features of CSS Flexbox
Set up CSS Flexbox for your web layout
Direct how elements increase or decrease in size
Dictate the direction, width, spacing, and more of Flexbox elements
Create a responsive web page with articles, footer, images, and more

Frameworks and tools covered: HTML, CSS

Your Courses, Your Way

All of our project-based courses are designed to be flexible – you can access courses 24/7 to fit them around your schedule, and choose the learning materials that suit you best.

You can even download your course videos and watch them offline using the Zenva app, available on iOS and Android.

Learn from World-Class Instructors

Our course instructors participate in elite developer programs and have been recognized for their demonstrated excellence in development and teaching.

That way, you can be confident that you’re learning the most up-to-date content from industry experts.

Interactive Lessons with Codemurai

Our unlimited access package comes with free access to all of the courses in our mobile app, Codemurai!

Available on iOS and Android, it’s full of interactive programming lessons and exercises so you can continue your learning on the go.

Achieve Real Results

Facilities

Location

Start date

Online

Start date

Different dates availableEnrolment now open

About this course

b
Why should I learn programming?
b
What will I achieve by taking these courses?
b
Technology changes quickly. What happens if the content becomes outdated?
b
I’m an absolute beginner who’s never coded before. Can I still do these courses?
b
What time commitment is needed?
b
Will these courses help me to change my career?
b
Can I watch the videos offline?

Some knowledge of HTML is recommended.

Questions & Answers

Add your question

Our advisors and other users will be able to reply to you

Who would you like to address this question to?

Fill in your details to get a reply

We will only publish your name and question

Emagister S.L. (data controller) will process your data to carry out promotional activities (via email and/or phone), publish reviews, or manage incidents. You can learn about your rights and manage your preferences in the privacy policy.

Reviews

This centre's achievements

2021

All courses are up to date

The average rating is higher than 3.7

More than 50 reviews in the last 12 months

This centre has featured on Emagister for 4 years

Subjects

  • Access
  • Layout
  • Web
  • Web Development

Course programme

Introduction 1:13


Introduction 1:13



1:13

Understanding Flexbox 4:34


Understanding Flexbox 4:34



4:34

Flexbox Terms Defined 2:44


Flexbox Terms Defined 2:44



2:44

Tools We'll Use 1:26


Tools We'll Use 1:26



1:26

Installing Visual Studio Code


Installing Visual Studio Code



Establishing a Parent Flex Container 5:16


Establishing a Parent Flex Container 5:16



5:16

Setting Flexbox Flow Directions 3:48


Setting Flexbox Flow Directions 3:48



3:48

Understanding Flex Width Behaviours 4:42


Understanding Flex Width Behaviours 4:42



4:42

Controlling Child Flex Item Wrapping 4:15


Controlling Child Flex Item Wrapping 4:15



4:15

Flexbox Shorthand for Faster Coding 2:32


Flexbox Shorthand for Faster Coding 2:32



2:32

Aligning and Spacing Apart Child Items 5:05


Aligning and Spacing Apart Child Items 5:05



5:05

Setting a Flex Starting Point 3:27


Setting a Flex Starting Point 3:27



3:27

Determining how Items will Increase 4:50


Determining how Items will Increase 4:50



4:50

Determining how Items will Shrink 3:49


Determining how Items will Shrink 3:49



3:49

Getting the Layout Set up 5:32


Getting the Layout Set up 5:32



5:32

Building the Header Area 9:38


Building the Header Area 9:38



9:38

Flexbox for the Hero Area - Part 1 6:34


Flexbox for the Hero Area - Part 1 6:34



6:34

Flexbox for the Hero Area - Part 2 5:31


Flexbox for the Hero Area - Part 2 5:31



5:31

Establishing the Articles Area 5:16


Establishing the Articles Area 5:16



5:16

Building the Article Containers 2:33


Building the Article Containers 2:33



2:33

Finishing up the Footer 2:37


Finishing up the Footer 2:37



2:37

Minor Layout Adjustments 5:19


Minor Layout Adjustments 5:19



5:19

Making the Layout Responsive 4:14


Making the Layout Responsive 4:14



4:14

Conclusion 0:26


Conclusion 0:26



0:26

Additional information

On-demand, 24/7 access 1 hours of video Certificate of completion Source code and PDF notes Closed captions

Bite-Sized CSS Flexbox

Price on request