CODEWITHSUNDEEP
phpjavascriptjqueryhtmlcss
AndreiBogdan
AndreiBogdan

Reputation: 11164

Removing unused CSS from website code

I am currently modifying a website template which I have found for free on the web.

When i remove, for instance, a div from the code, the CSS for it remains behind, in one or more files.

Is there a tool which automatically removes unused CSS from my code? So i don't manually search for every id and class that i don't use anymore and remove the code.

Upvotes: 20

Views: 14004

Answers (2)

shanabus
shanabus

Reputation: 13115

You can get pretty close to what you are asking for with the Google Chrome's Audit tab under Developer Tools. It does not remove unused CSS, but it will show you what CSS rules are not being used.

Observe: enter image description here

Upvotes: 12

NewlessClubie
NewlessClubie

Reputation: 1003

Intellij IDEA can do this. Navigate to CSS file, click on 'Analyze' and then reduce the analysis scope to a selected file. After that you will be presented with all problems related to this file. All errors are divided into categories, navigate to the category named 'Unused CSS selector' to find what you're after. The same should work for JavaScript. Please note that CSS support is only available in Ultimate version of IDEA, though it's totally worth every buck you spend on it. There is also a 30-day trial period for Ultimate edition. Oh, and by the way it has an excellent PHP support. There is also a cheaper PHP-specific IDE from the same vendor called PHPStorm. Analysis features are also available there.

Upvotes: 26

Related Questions