Custom CSS for a particular text/html widget in Wordpress

I have a couple of text widgets on my Home Sidebar. There is one text widget in particular that I want it to implement custom CSS written in my child theme rather than the default styling provided by the theme. Is that possible? If yes, how?

Edit: the below answer generally doesn't work because most widgets have their css implemented after both, the theme style and the custom style file.

Topic widget-text widgets css Wordpress

Category Web


From firebug, you can see the ID name of the text widget, which is "text-some number" and this is what we need to customize. the specific WordPress widget has the class name "widget" (from class="widget widget_text".). All we need to do is add a new CSS selector to style the selected widget.

#sidebar .widget #text-3564277 {
background-color: #fff;
border: 1px solid #ddd;
padding: 10px;
}

or you can go for any plugins like widget css classes which will add a field to all wordpress widgets for entering the custom class. then you can style that class.

About

Geeks Mental is a community that publishes articles and tutorials about Web, Android, Data Science, new techniques and Linux security.