Join our ‘How to Start a Web Design Business’ Course – and use strategies to grow, get clients, and generate recurring income: https://websquadron.co.uk/how-to-start-a-web-design-business/
Book your 1-2-1 Consultation: https://websquadron.co.uk/socials
This is how ti work with CSS Grid Bespoke Layout with Span – Elementor WordPress Tutorial
Code for spanning:
@media screen and (min-width: 780px)
{
selector {
grid-column: 1/3;
grid-row: 1/3;
}
}
We love to create – share – respond – and deliver.
๐ง Learn with our Mastery Modules: https://websquadron.co.uk/web-design-mastery/
๐ All of our Important Links: https://websquadron.co.uk/socials/
๐ Join our Facebook Group: https://www.facebook.com/groups/3309523509284305
๐ Get Code Snippets Pro: https://r.freemius.com/10565/3304295/
๐ Get Elementor Pro: https://be.elementor.com/visit/?bta=25741&nci=5383
๐ Boost your YouTube Analysis: https://www.tubebuddy.com/websquadron
๐ Get our Merchandise: https://websquadron.co.uk/merchandise
๐ฅน Support us: https://paypal.me/Websquadron
Hire us to work on your Website!
๐ info@websquadron.co.uk
๐ฉโ๐ป Visit https://websquadron.co.uk
source
You just saved me countless of time. Thanks ser
Great vid again! Is it possible to populate that kind of grid with dynamic content / custom post types?
Nice, thank you! Can I have a grid in a blogpost?
Will this be implemented in the GRID module, instead of using custom CSS?
Thanks for this great tutorial!
aspect-ratio: 16/9 /* when the image feels too square in mobile */
Another decent feature and nice video to explain it all, thanks Imran.
Very nice video! Making sense of this now.
Somehow, my layout worked without the 'grid-row: 1/3;' of the code!
Thanks Imran!
Nice! Thanks for creating this tutorial!
Another awesome walkthrough mate. It saves me a lot of time figuring things out with this. Thank you!
Thanks Imran, however, I had to set the min-width to 768px for the CTAs to maintain the two-column span on the tablet as they do on the desktop:
@media screen and (min-width: 768px)
cool video, isnt a method to autogrid or autoshrink the grid on other device if a cannot display 3 columns then use one. bricks do it more easier in that way… anyway im using elementor again cause bricks it is not working well with compatibilities..
I believe they'll be adding span controls soon. One nit: you said "when the resolution is greater than 780px". I think you meant when the screen width is greater than 780px. Responsiveness has nothing to do with resolution, something many people watching videos like this get confused about. (also, why 780 instead of 768?)
Very informative video imran ๐ thanks