How to override CSS of a plugin in wordpress from styles.css

I am using the plugin: “WordPress Contact Form 7”.

I want to override the CSS that the plugin uses with my own CSS.
I want to do this in such a way that even if I update this plugin, or change my theme, my changes will still remain.

Read More

What is the best way to do this?
So far I have been trying to edit style.css of my theme. But this has produced inadequate results. Since style.css may be loaded before the css of the plugin, the css may be overridden by the plugin. It works only if I specify properties for things that have not been defined in the plugin css.

Related posts

Leave a Reply

2 comments

  1. If you only have a few modifications to apply, by far the simplest way to override a plugin’s stylesheet is to add body in front of the element you are targeting within your style.css file. Adding body adds CSS specificity to the selector, allowing it to override the original styling. Like Reyzis say.

    body .plugin-class {
        font-size: 30px;
    }