Last active
August 6, 2021 16:24
-
-
Save askwpgirl/4f83c25cd4f08607eeb2653d1aa21336 to your computer and use it in GitHub Desktop.
Elementor Pro 3.3.1 grid styles
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* Add to Appearance > Customize > Custom CSS or your child theme's style.css file to bring back the Elementor WooCommerce product grid layouts | |
| These were removed in Elementor Pro 3.3.3. Is fixed in Elementor Pro 3.3.4. */ | |
| @media (min-width: 1025px) { | |
| .elementor-element.elementor-products-grid ul.products.columns-2 { | |
| grid-template-columns: repeat(2, 1fr); } | |
| .elementor-element.elementor-products-grid .woocommerce.columns-2 ul.products { | |
| grid-template-columns: repeat(2, 1fr); } | |
| .elementor-element.elementor-products-grid ul.products.columns-3 { | |
| grid-template-columns: repeat(3, 1fr); } | |
| .elementor-element.elementor-products-grid .woocommerce.columns-3 ul.products { | |
| grid-template-columns: repeat(3, 1fr); } | |
| .elementor-element.elementor-products-grid ul.products.columns-4 { | |
| grid-template-columns: repeat(4, 1fr); } | |
| .elementor-element.elementor-products-grid .woocommerce.columns-4 ul.products { | |
| grid-template-columns: repeat(4, 1fr); } | |
| .elementor-element.elementor-products-grid ul.products.columns-5 { | |
| grid-template-columns: repeat(5, 1fr); } | |
| .elementor-element.elementor-products-grid .woocommerce.columns-5 ul.products { | |
| grid-template-columns: repeat(5, 1fr); } | |
| .elementor-element.elementor-products-grid ul.products.columns-6 { | |
| grid-template-columns: repeat(6, 1fr); } | |
| .elementor-element.elementor-products-grid .woocommerce.columns-6 ul.products { | |
| grid-template-columns: repeat(6, 1fr); } | |
| .elementor-element.elementor-products-grid ul.products.columns-7 { | |
| grid-template-columns: repeat(7, 1fr); } | |
| .elementor-element.elementor-products-grid .woocommerce.columns-7 ul.products { | |
| grid-template-columns: repeat(7, 1fr); } | |
| .elementor-element.elementor-products-grid ul.products.columns-8 { | |
| grid-template-columns: repeat(8, 1fr); } | |
| .elementor-element.elementor-products-grid .woocommerce.columns-8 ul.products { | |
| grid-template-columns: repeat(8, 1fr); } | |
| .elementor-element.elementor-products-grid ul.products.columns-9 { | |
| grid-template-columns: repeat(9, 1fr); } | |
| .elementor-element.elementor-products-grid .woocommerce.columns-9 ul.products { | |
| grid-template-columns: repeat(9, 1fr); } | |
| .elementor-element.elementor-products-grid ul.products.columns-10 { | |
| grid-template-columns: repeat(10, 1fr); } | |
| .elementor-element.elementor-products-grid .woocommerce.columns-10 ul.products { | |
| grid-template-columns: repeat(10, 1fr); } | |
| .elementor-element.elementor-products-grid ul.products.columns-11 { | |
| grid-template-columns: repeat(11, 1fr); } | |
| .elementor-element.elementor-products-grid .woocommerce.columns-11 ul.products { | |
| grid-template-columns: repeat(11, 1fr); } | |
| .elementor-element.elementor-products-grid ul.products.columns-12 { | |
| grid-template-columns: repeat(12, 1fr); } | |
| .elementor-element.elementor-products-grid .woocommerce.columns-12 ul.products { | |
| grid-template-columns: repeat(12, 1fr); } } | |
| @media (max-width: 1024px) { | |
| .elementor-element.elementor-products-grid ul.products { | |
| grid-template-columns: repeat(3, 1fr); } } | |
| @media (max-width: 767px) { | |
| .elementor-element.elementor-products-grid ul.products { | |
| grid-template-columns: repeat(2, 1fr); } } | |
| @media (min-width: 1025px) { | |
| .elementor-element.elementor-products-grid.elementor-products-columns-1 ul.products { | |
| grid-template-columns: repeat(1, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-2 ul.products { | |
| grid-template-columns: repeat(2, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-3 ul.products { | |
| grid-template-columns: repeat(3, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-4 ul.products { | |
| grid-template-columns: repeat(4, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-5 ul.products { | |
| grid-template-columns: repeat(5, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-6 ul.products { | |
| grid-template-columns: repeat(6, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-7 ul.products { | |
| grid-template-columns: repeat(7, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-8 ul.products { | |
| grid-template-columns: repeat(8, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-9 ul.products { | |
| grid-template-columns: repeat(9, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-10 ul.products { | |
| grid-template-columns: repeat(10, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-11 ul.products { | |
| grid-template-columns: repeat(11, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-12 ul.products { | |
| grid-template-columns: repeat(12, 1fr); } } | |
| @media (max-width: 1024px) { | |
| .elementor-element.elementor-products-grid.elementor-products-columns-tablet-1 ul.products { | |
| grid-template-columns: repeat(1, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-tablet-2 ul.products { | |
| grid-template-columns: repeat(2, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-tablet-3 ul.products { | |
| grid-template-columns: repeat(3, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-tablet-4 ul.products { | |
| grid-template-columns: repeat(4, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-tablet-5 ul.products { | |
| grid-template-columns: repeat(5, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-tablet-6 ul.products { | |
| grid-template-columns: repeat(6, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-tablet-7 ul.products { | |
| grid-template-columns: repeat(7, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-tablet-8 ul.products { | |
| grid-template-columns: repeat(8, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-tablet-9 ul.products { | |
| grid-template-columns: repeat(9, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-tablet-10 ul.products { | |
| grid-template-columns: repeat(10, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-tablet-11 ul.products { | |
| grid-template-columns: repeat(11, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-tablet-12 ul.products { | |
| grid-template-columns: repeat(12, 1fr); } } | |
| @media (max-width: 767px) { | |
| .elementor-element.elementor-products-grid.elementor-products-columns-mobile-1 ul.products { | |
| grid-template-columns: repeat(1, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-mobile-2 ul.products { | |
| grid-template-columns: repeat(2, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-mobile-3 ul.products { | |
| grid-template-columns: repeat(3, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-mobile-4 ul.products { | |
| grid-template-columns: repeat(4, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-mobile-5 ul.products { | |
| grid-template-columns: repeat(5, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-mobile-6 ul.products { | |
| grid-template-columns: repeat(6, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-mobile-7 ul.products { | |
| grid-template-columns: repeat(7, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-mobile-8 ul.products { | |
| grid-template-columns: repeat(8, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-mobile-9 ul.products { | |
| grid-template-columns: repeat(9, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-mobile-10 ul.products { | |
| grid-template-columns: repeat(10, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-mobile-11 ul.products { | |
| grid-template-columns: repeat(11, 1fr); } | |
| .elementor-element.elementor-products-grid.elementor-products-columns-mobile-12 ul.products { | |
| grid-template-columns: repeat(12, 1fr); } } |
Author
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This was fixed in Elementor Pro 3.3.4 and then removed again in 3.3.5. You can use the above styles in your CSS until it's fixed.