Menu
I have a couple CSS files with overlapping CSS selectors that I'd like to programmatically merge (as in not just appending one file to the end of the other). Is there any tool to do this online? or a Firefox extension perhaps?
532
To combine external CSS files, you can simply copy / paste all of your CSS code into one main file. Therefore all of the content from within the other CSS files will now reside within the main file allowing the browser to only make one request for a CSS file instead of multiple.
Use <style type="text/css"></style> in your header tag to merge the css and html into one file. Then paste your css in between the style tags.
You can download it from the WordPress repository or by searching for it within your WordPress dashboard under “Add New” plugins. Once installed you will want to go into the settings and enable the “Optimize CSS Code” option. This will concatenate (combine) your CSS files.
I found Factor CSS - complete with source code, but I think it does way more than I'd need. I really just want to combine CSS blocks that have the same selectors. I'll check out the source code and see if it can be converted to something usable as a TextMate bundle. That is, unless someone else manages to get to it before me.
EDIT: Even better - here's a list of web-based tools for checking/formatting/optimizing css.
104
No I wish there was but the programming effort seems too much since there are multiple ways to reference a single element. The best that you can do is use a runtime like FireBug to find duplicates.
22
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
