Elementor Tutorial - Flexbox vs Grid Container Layout

In today's tutorial, I am going to be discussing with you the differences between the Elementor Flexbox and Grid container layouts.
Follow me on Facebook - / thewebmonkeyonline
Visit my blog - thewebmonkeyonline.com/
Buy Siteground Web Hosting - www.siteground.com/go/you_tube
For business inquiries, product reviews or partnerships, please send an email to [e-mail]

[@ismailsaadeh6087]

Your video is great and easy to understand, but this will increase the DOM size and slow down the page's loading speed.

[@LogologicsNl]

Thanks, this helped me understand the difference!👍

[@abhisheksawant8120]

A great video to explain the concept.

[@tonybp]

Good explanation, thanks. BTW I had no idea an oasis like that one existed, pretty cool.

[@TheWebMonkey]

Glad you liked it!

[@beatrisprinz3421]

Indeed, this video guide is very helpful. Love it much. Thank you

[@TheWebMonkey]

You're very welcome!

[@WrestlingFan00]

Helpful video thank you!

[@PakistanCraneGroup]

Very helpful❤

[@TheWebMonkey]

Glad you think so!

[@ibrahimniloy2303]

Great man

[@ghislainemahler1880]

Hi Alex, thanks again for a great video - you are such a great teacher!!! Question: Using this grid and flex box system, do you think it is possible to create a blog page where posts are going to be at different levels? The straight columns and rows are a bit boring to me, I wonder if you would have a tip for that. Thanks!

[@TheWebMonkey]

You can pull that of by using a masonry layout. The posts element provides that feature.

[@ghislainemahler1880]

Great, thanks Alex!😊

[@nhatnam4627]

You say that columns or rows that do not have the same size, and one dimensional flow, then flexbox is the one to choose. But for main container containing 2 rows with different heights, you choose grid with row = 1 to make the height of first row shorter., I am confused.

[@nuresponse]

It seems that we can't build this structure with Grid alone... so the questions then becomes: Is it better to just use Flex to build this... or use a combination of Flex & Grid to build this? Why not just use Flex box for all of the nested containers? I was able to accomplish this for all screen sizes by simply: 1. Setting the menu sub-container to 25% & 2. Setting the parent container for the Main/Right to 100%. Am I missing something? Is there an inherent positive or negative to using both Flex & Grid in the same page? Does it load any extra CSS or JS files to use both? What about conflicts... I didn't see any obvious benefits in this example for using both... over just using Flex. Would love to hear your thoughts.

[@imantriatmojo5064]

Is that responsive ?

[@ClaudiuOvidiuStoica]

Dude, this is not the right way to do it. Will increase DOM a lot