Quick pro tip: You can use the Icon Box or Image Box widgets instead of the inner containers, they do not need to be in containers and will make the code even cleaner (I forgot to mention in the video)

You're very generous with your sharing mate 🙏

I've been at this for 2 months, and FINALLY, someone who can explain in a way that actually makes sense to me. Damn...thank you man! I'll be coming back for more gold.

I am loving these tutorials. Very informative.

Jeffrey, you blow me away! Thank you for your teaching and your ocd lol. Mike in the UK

Bro, your tutorials are "on-point"... good job. Been designing on WordPress over 16 years... still learning.

Great content, a huge amount of work in the background, a great added value coupled with a very practical proposal thanks to the template that goes in the same direction: it's valuable for training/improvement. This new content proposal is very appreciable, you deserve firstly to be congratulated and especially a big thank you. You've "earned" a new subscriber to your newsletter 😊 Hats off for your content proposal and for your generosity

Just Awesome!! Thank you.

Excellent work Jeffrey and thank you so much for this pre-built grid template, you are very generous person.

Great tutorial many thanks for this 😊

Really nice Jeffrey, thanks. Hopefully Elementor will continue to work on Grid to include at least row and column span to make these kinds of layouts much easier.

This is great, thanks for putting this video together and providing the templates.

Thank. you Jeffrey, any idea how you can do a masonry grid ? or is that not possible with this grid system in Elementor?

Thank you very much for this video and the great template.

I like your explanation. Congratulations.. From Brazil

Great stuff just subscribed. Question: Can this same info and template be use with the free, basic Elementor program?

Nice Video + Free templates

Thank you for your time to do these tutorials. I would like to see a tutorial with more responsive where you have the desktop with several horizontal containers that are nested and then in the tablet mode, take some of the nested items and be able to mix up the order. Possibly even take an element from one nested container to another nested container in a different order. For example on desktop: left side, container 1: header, text block, button. Right column container 2 image carousel , text block under. Container 3 under container 2 but have a group of text blocks. I had this design, but when I switched to tablet, I needed to move the button to the bottom, the image carousel to the top, the left column 1 header with the left column text block under the header. I tried numbering order, but that didn’t work either. I finally gave up. I’m new to Elementor and I’m afraid I have been trying force the design in ways Elementor cannot handle.

Awesome 🎉 thanks 💗

@LytboxStudio If you just add a grid widget with some flex container (full with). Than just add "selector { grid-row-end: span 2; } (or grid-column-end: span 2) on the block you want to span over multiple rows or columns. That is much easier in my opinion. What do you think?

you are amazing

Thank you for this amazing video can please make a video about the main differents between flexbox and Grid and which cases we need to use any of them

Love the video and your content, Question: if I have a legacy elementor site that doesn't use flexbox/grids, what is the best way to convert them to flexbox/grids? One-by-one or use Elementor to auto do it and inspect?

that looks good. is there any chance that we can do this for a mega menu? I m trying to figure oiut a way to build a mega menu as lightweight as possible (minimal DOM) .. I just sense that the footer and menus build with Elementor consume a lot of ressources... I wish there were more tutorials like this that would focus on performance...thanks for your work!

Thanks!

Hello Sir Jeffrey! I have a curious question about INNER SECTIONS. Is there an update from Elementor that this feature will be discontinued because of CONTAINER'S existence? I am wondering what would happen to all sites prior to this update if INNER SECTIONS will be discontinued. I hope you'll notice and respond to this inquiry. Thank you so much!

I would love to see how to use the grid layout with a side bar on the right

HI, if I want to use the 12-8-4 grids fro desktop/tablet/phone - is that possible? I tried media queries but the gaps of my initial 12-column gird remain and as a result making the width shorter

Is it possible to achieve that without custom css ? I am pretty sure that it would be possible.

How to import the template you provided? I got an error when imported to elementor library... please help!

It didnt work in my elementor... turned on the Grid setting etc...

briliant. Yeah. You cannot achive this with flex container.

Ok, but what's the advantage of this since there are so many inner containers in this free template? I thought the point of this video and tutorial in general is to avoid that, and minimize the use of inner containers via CSS grid.

Always great information but sometimes in your enthusiasm it skips over the important stuff. (The stuff that si going to catch you ourt) An example is that you started with an overview of the container grid and extolled its ease of use. I was looking forward to part 2 of using the grid and getting a better understanding but it seems that it was easier to just provide templates rather than to cover the learning part of the grid. I was trying to move from flex-box to the grid after seeing your first video but soon came into an issue which was not really explained and that was when I set up a grid and started to drag a heading then some text to go below the heading it does not work. There is a reason but this is not explained. You are not the only one who has missed these things out. In fact there seems to be the same content where they spend equal time to explain the difference between the flex-box (Which has been considerably covered most everywhere on similar channels. I am an experienced educator albeit in other areas. What I would do differently? I would suggest that you explain first how to use the grid. (You can explain the difference afterwards between flex-box and the grid)) The eliminates the slowing of the learning process where people are still thinking about what you have just covered. rather than the new informationIt which is more important for them to focus on. As this is the new information you wish to impart rather than the past information. If you did wish to cover something about the differences in the flex-box then you could demonstrate not just the layout options but how you would use it. So you could show that before we used to drag a heading, text and button into a flex-box container but if you try to do this in a grid it just moves to the next box. (flow) The beauty of this is that you have already given a fundamental heads up on how this may not work as they had worked before using flex-box despite the similarities between the flex-box and the grid. I regard you are highly experienced educator and you usually put out different content to others even if it is the same subject. If you were to revisit this subject then I would suggest a tutorial in converting a template using the grid instead of the flex-box. You could proved a download to a template to work along with. I appreciate that you have a busy schedule so content has to come out quick and so things need ot be left out. Thank you.