{"id":121253,"date":"2023-07-05T10:42:17","date_gmt":"2023-07-05T05:12:17","guid":{"rendered":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/docs\/elementor-section-vs-flexbox-containers\/"},"modified":"2023-07-05T11:59:21","modified_gmt":"2023-07-05T06:29:21","slug":"elementor-section-vs-flexbox-containers","status":"publish","type":"documents","link":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/docs\/elementor-section-vs-flexbox-containers\/","title":{"rendered":"Elementor Section vs NEW Flexbox Containers &#8211; Page Speed Comparison | Elementor 3.6 Update [Video Tutorial]"},"content":{"rendered":"<!-- wp:embed \",\"type\":\"video\",\"providerNameSlug\":\"youtube\",\"responsive\":true,\"className\":\"wp-embed-aspect-16-9 wp-has-aspect-ratio\"} -->\r\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\r\n<iframe title=\"Elementor Section vs NEW Flexbox Containers - Page Speed Comparison | Elementor 3.6 Update\" width=\"1200\" height=\"675\" src=\"https:\/\/www.youtube.com\/embed\/1ayFKs7uk4Y?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" allowfullscreen><\/iframe>\r\n<\/div><\/figure>\r\n<!-- \/wp:post-content -->\r\n\r\n<\/figure>\r\n<!-- \/wp:embed -->\r\n<!-- wp:heading  -->\r\n<h5 class=\"wp-block-heading\">Video Duration: 23 : 38 <\/h5>\r\n<!-- \/wp:heading -->\r\n<!-- wp:heading -->\r\n<h2 class=\"wp-block-heading\">Video Overview<\/h2>\r\n<!-- \/wp:heading -->\r\n<!-- wp:paragraph -->\r\n<p>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. \n\nWe 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.\n\n<br>\n\u25b6  Resources:\n<br>\n1) Flex Align Item Playground &#8211; <a href=\"https:\/\/u5pxp.csb.app\/\">https:\/\/u5pxp.csb.app\/<\/a>\n<br>\n2) Flex Justify Content Playground &#8211; <a href=\"https:\/\/2yubm.csb.app\/\">https:\/\/2yubm.csb.app\/<\/a>\n<br>\n3) Understanding Flex &#8211; <a href=\"https:\/\/flexbox.tech\/\">https:\/\/flexbox.tech\/<\/a>\n<br>\n4) Elementor Docs on Flex Containers &#8211; <a href=\"https:\/\/elementor.com\/help\/advanced-container-knowledge\/\">https:\/\/elementor.com\/help\/advanced-container-knowledge\/<\/a>\n<br>\n5) Playground for Elementor Backend with Flex Enabled- <a href=\"https:\/\/playground.elementor.com\/demo\/flexbox\/\">https:\/\/playground.elementor.com\/demo\/flexbox\/<\/a>\n<br>\n6) Learn CSS &#8211; <a href=\"https:\/\/w3schools.com\/css\">https:\/\/w3schools.com\/css<\/a>\n\n<br>\nVisit: <a href=\"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/\">https:\/\/etemplates.wdesignkit.com\/theplusaddons\/<\/a> for 120+ Best Elementor Widgets\n\n<br>\n&#8212;\n<br>\nTime stamps  \n<br>\n0:00 Intro\n<br>\n2:09 Understanding the Basics : What is CSS?\n<br>\n2:43 How to Learn CSS for Elementor\n<br>\n3:30 Understanding the Technical difference b\/w Block and Flex\n<br>\n4:26 Display: Block Explained\n<br>\n5:41 Display: Flex Explained\n<br>\n8:35 Exploring New Options in Elementor Flex Containers\n<br>\n9:23 Elementor Display Flex : Direction\n<br>\n9:58 Elementor Display Flex: Align Items\n<br>\n11:28 Elementor Display Flex: Justify Content\n<br>\n13:15 Flex Box Playground by Elementor\n<br>\n15:12 When will The Plus Addons for Elementor widgets<\/p>\r\n<!-- \/wp:paragraph -->\r\n<!-- wp:shortcode -->\r\n\n<div class=\"wp-block-buttons pseocta is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-a89b3969 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button pseocta\"><a class=\"wp-block-button__link has-nxt-global-color-1-background-color has-background wp-element-button\" href=\"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/pricing\" target=\"_blank\" rel=\"noreferrer noopener\">Get The Plus Addons for Elementor<\/a><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-buttons pseocta is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-a89b3969 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button pseocta\"><a class=\"wp-block-button__link has-nxt-global-color-1-background-color has-background wp-element-button\" href=\"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/elementor-widgets\/\" target=\"_blank\" rel=\"noreferrer noopener\">View 120+ Elementor Widgets Demo<\/a><\/div>\n<\/div>\n\n\n\n<style>\n.pseocta .wp-block-button{\n padding: 1em 0em !important;\n}\n<\/style>\n\r\n<!-- \/wp:shortcode -->","protected":false},"author":16,"featured_media":121254,"parent":0,"comment_status":"open","ping_status":"open","template":"","format":"standard","docs":[575,576],"class_list":["post-121253","documents","type-documents","status-publish","format-standard","has-post-thumbnail","hentry","docs-video-tutorials","docs-watch-video-tutorials"],"acf":[],"_links":{"self":[{"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/documents\/121253","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/documents"}],"about":[{"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/types\/documents"}],"author":[{"embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/comments?post=121253"}],"version-history":[{"count":0,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/documents\/121253\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/media\/121254"}],"wp:attachment":[{"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/media?parent=121253"}],"wp:term":[{"taxonomy":"docs","embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/docs?post=121253"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}