Learn The Elementor Flexbox Container in Under 5 Minutes

What is Flexbox? Well, basically, it's replacing the old inner sections you used in Elementor. Flexbox allows you to have more customizability, faster load times, leaner code, and better responsiveness. And I'm going to show you how to use it in less than five minutes.
Table Of Contents
00:00 - Intro
00:16 - What is Flexbox?
01:03 - Flexbox tutorial
EXCLUSIVE WORDPRESS DEALS 2023
🟡 SureCart -- www.wpcrafter.com/surecart (SAVE 50% Auto Applied)
🟡 SureMembers -- www.wpcrafter.com/suremembers (SAVE 50% Auto Applied)
🟡 Presto Player -- www.wpcrafter.com/prestoplayer (SAVE 33% Auto Applied)
🟡 Astra Theme -- www.wpcrafter.com/astra (SAVE 10% Coupon WPCRAFTER)
🟡 CartFlows -- www.wpcrafter.com/cartflows (SAVE 40% Auto Applied)
🟡 Cloudways -- www.wpcrafter.com/cloudways (SAVE 20% Coupon WPCRAFTER)
🟡 BuddyBoss -- www.wpcrafter.com/buddyboss (SAVE 10%)
* Want to offer a discount to WPCrafter subscribers, contact me on my website
BEST WORDPRESS PAGE BUILDERS
🟡 Spectra -- www.wpcrafter.com/spectra
🟡 Elementor -- www.wpcrafter.com/elementor
🟡 Beaver Builder -- www.wpcrafter.com/beaverbuilder
🟡 Divi -- www.wpcrafter.com/divi (SAVE 20%)
BEST WORDPRESS HOSTING
🟡 Full List -- www.wpcrafter.com/hosting
🟡 Cloudways -- www.wpcrafter.com/cloudways (SAVE 20% Coupon WPCRAFTER)
🟡 Hostinger -- www.wpcrafter.com/hostinger (SAVE 75%)
🟡 NameHero -- www.wpcrafter.com/namehero (SAVE 70%)
🟡 SiteGround -- www.wpcrafter.com/siteground (SAVE 70%)
CONTACT WPCRAFTER
☑ Website -- www.wpcrafter.com
☑ Facebook Group -- / wpcrafter
☑ Twitter -- / wpcrafter
☑ Twitter -- / adampreiser
All of the opinions expressed in this video are my own, I was not paid to make this video. Whenever there is a link in any of my videos, if there is a referral program available, please assume that you are clicking on a referral link.

[@Linda-we6en]

Your great at explaining things. Thank you. It is a little hard to focus though because of the repetitive music in the background. You really don't need the music.

[@MartinMcLoughlinNo1]

Great tutoring technique. Thanks

[@WasifAhmed91]

Great. But what about responsiveness of Flex box container? Can you please also show the things.
Thanks

[@mubashirali3324]

I can not actually see the things in details when working on screen

[@martyshmanka]

Would have been good to show the mobile results. Otherwise... what is the benefit using flexboxes here?

[@maxtermiller5947]

This is how to explain things, I now feel confident, thanks for not explaining this in 2 hours.

[@SaeedMasri]

Apologies, my friend. It seems you've added two unnecessary containers to the first hero section and for the second section you could avoid adding extra container. In order to fully utilize the benefits of flexbox, it's important to use it without restricting ourselves to specific sections and columns.
I admit that I'm not immune to making mistakes with flexbox and sometimes when in rush I use it incorrectly.

Where's the two unnecessary containers in the hero section?

[@SaeedMasri]

@ I recorded a quick Loom video on how to create the hero section with one container but links are now allowed, I couldn't post it.

[@ronrichardson175]

Yep, total of three containers in the hero section. Only needs ONE! The key is to make the main container a wrapped column and set each widget to Advanced > Width > Custom width of 100%. The buttons can be custom width 50%. Same with the Our Services --- that should be one container and simply set the widgets' widths to custom as above.

@@ronrichardson175 interesting! Thanks for explaining

[@630Biz]

Great... now just slow it down a 1000% for us amateurs. LOL

[@ronrichardson175]

Both H1s ? Not good. And why so many containers. Sheesh. Use the widget's Width > Custom

[@alexway101]

Who needs Elementor in 2023? Do you plan to make videos about some modern WordPress stuff?

[@DesignCutters]

I have not used Elementor yet myself, but what would you suggest instead? I'm not a fan of WordPress to begin with but do like the ease of drag and drop user interfaces.

[@alexway101]

@@DesignCutters Native WordPress block editor - Gutenberg. With GeneratePress premium theme and GenerateBlocks Pro plugin. Third-party page builders are dead. Gutenberg replaced them. But some people still live in the past, and even keep making videos about this trash :)

[@chrisabaird]

What do you suggest?