Elementor Section vs NEW Flexbox Containers – Page Speed Comparison | Elementor 3.6 Update [Video Tutorial]

Updated on March 12, 2024 by Editorial Team
Table Of Content
Video Duration: 23 : 38

Video Overview

In this video, we will see how to use the new Elementor 3.6 Flex Box Container, with a live demo. We explain all the options from justifying content, row direction, wrap, no-wrap, align items, and everything.

We make a live page speed comparison test to show you how much clearer DIVS are created. The New Flex Containers is a major upgrade to faster performance.

▶ Resources:

1) Flex Align Item Playground – https://u5pxp.csb.app/

2) Flex Justify Content Playground – https://2yubm.csb.app/

3) Understanding Flex – https://flexbox.tech/

4) Elementor Docs on Flex Containers – https://elementor.com/help/advanced-container-knowledge/

5) Playground for Elementor Backend with Flex Enabled- https://playground.elementor.com/demo/flexbox/

6) Learn CSS – https://w3schools.com/css

Visit: https://theplusaddons.com/ for 120+ Best Elementor Widgets

Time stamps

0:00 Intro

2:09 Understanding the Basics : What is CSS?

2:43 How to Learn CSS for Elementor

3:30 Understanding the Technical difference b/w Block and Flex

4:26 Display: Block Explained

5:41 Display: Flex Explained

8:35 Exploring New Options in Elementor Flex Containers

9:23 Elementor Display Flex : Direction

9:58 Elementor Display Flex: Align Items

11:28 Elementor Display Flex: Justify Content

13:15 Flex Box Playground by Elementor

15:12 When will The Plus Addons for Elementor widgets

Get Free 25+ Secrets to Make Elementor Website Faster [Guaranteed Results]

    Subscribe to our YouTube Channel for Elementor Tutorials
    New Video Every Week!
    Automatically Convert Figma Designs to 100% Editable Elementor Website

    Related Docs