In this tutorial, we are creating tables in Elementor with CSS only. No need to install a plugin, no HTML. Just simple, plain text using Text editor widget, unordered lists and some CSS. First, we will style the unordered (bullet) list that creates each column of our table. We will remove the bullets, add padding and spacing and text alignment. We can then apply shading to our table rows and round corners to our table cells using border-radius. We can make even or odd rows in a specific color, make only the first column left aligned and the rest centrally aligned etc.
Lastly, using nth-child elements, we will target our columns (unordered lists) and individual cells as well as table titles.
💻 Grab the CSS code here:
https://www.cssgamelab.com/2024/11/28...
🚀 Interactive CSS Basics course for designers and non-coders:
https://www.cssgamelab.com/
👉 Get 20% off using the code VELVET20OFF at Checkout.
––––––––––––––––––––––––––––––
PURCHASE AND DOWNLOAD ELEMENTOR PRO:
https://be.elementor.com/visit/?bta=6...
––––––––––––––––––––––––––––––
SIMPLE CUSTOM CSS AND JS PLUGIN:
To use custom CSS code with Elementor FREE, I am using the Simple Custom CSS and JS plugin for Wordpress that you can download here:
https://wordpress.org/plugins/custom-...
Have fun and thanks for watching!
If this tutorial helped you, please share or subscribe.
––––––––––––––––––––––––––––––
This video and description may contain affiliate links. If you click on a link and make a purchase, I will receive a commission from the sale. That way you are supporting my channel and allowing me to keep making videos and posts like this. I only promote products that I use, have experience with and support, such as Elementor Pro.
––––––––––––––––––––––––––––––
Have a specific problem in Elementor that you don't know how to solve with CSS? Comment below to let me know which video you would like to see next!
––––––––––––––––––––––––––––––
MUSIC:
Artist: Corbyn Kites
Track Title: Staycation
––––––––––––––––––––––––––––––