How to Add Custom CSS to Elementor Column/Section or Widget?

Updated on November 20, 2024 by Editorial Team
Table Of Content

Do you want to customize the look and feel of your Elementor website beyond the options provided by the widgets? This is where custom CSS comes into play, which can help you customize and make specific design changes to your Elementor website.

With the Section Custom CSS extension from The Plus Addons for Elementor, you can easily add custom CSS to target specific sections, inner sections, containers, inner containers and elements within those in Elementor.

Required Setup

How to Activate the Section Custom CSS Extension?

Go to 

  • The Plus Addons Widgets 
  • Search the widget name and turn on the toggle.
Section custom css how to add custom css to elementor column/section or widget? From the plus addons for elementor

Note: If you want to add custom CSS to columns of the old Elementor Sections you need to activate the Column Custom CSS extension.

Key Features

  • Target specific section – You can easily target a specific section or content within it.

How to Add Custom CSS in Elementor?

Select a section, inner section, container or inner container and follow the steps –   

1. Go to Advanced > Plus Extras.

By enabling the Section Overflow Hidden toggle, you can hide the scrollbar of the section.

2. Then in the Custom CSS section, you can write your custom CSS.

You can write global CSS rules that can affect the entire site or you can use the “selector” prefix to target the section itself or the content within the section only. 

Section custom css settings

For example, if you only want to change the color of H2 in the section you can write the CSS like this

selector h2{
color:red;
}

This will only change the color of H2 in that section. 
Following this process, you can target and customize the style of any widget.

For more in-depth guidance on using CSS in Elementor for free. <- Click here to learn more.

OR
Get Free 25+ Secrets to Make Elementor Website Faster [Guaranteed Results]



    Subscribe to our YouTube Channel for Elementor Tutorials
    New Video Every Week!
    Automatically Convert Figma Designs to 100% Editable Elementor Website
    X