Reputation: 177
I've been using Adobe Reflow to generate layouts. but to my horror, i found that it creates a separate selector for identical elements too, and each of these selectors have their properties defined separately. This has resulted in enormous file sizes for small documents. I cannot manually merge these selectors due to their enormous size. I've tried several minifiyng programs, but none of them have solved my problem.
in short, need a minifier that can convert:
#div1{ height:50px; color:'blue';}
#div2{ height:50px; color:'blue';}
to
#div1, #div2{ height:50px; color:'blue';}
Upvotes: 2
Views: 2381
Reputation: 7440
This is best tool based on its description and samples:
CSS minifier with structural optimizations https://css.github.io/csso/csso.html
for example:
var result = csso.minifyBlock('color: rgba(255, 0, 0, 1); color: #ff0000');
console.log(result.css);
// > color:red
Which seems so smart!!
Upvotes: 2
Reputation: 78686
My favorite online compressor is - http://refresh-sf.com/ it will do the merge for you.
Upvotes: 2
Reputation: 8049
Just ran this code on http://www.cssportal.com/css-optimize/, it worked keeping the default settings. Unfortunately I've never used this before and don't know how it would work on a large CSS file.
Hope that can point you in the right direction.
Upvotes: 0