CSS Intelligent Merger

Question

I am looking for a tool very similar to http://www.tothepc.com/archives/combine-merge-multiple-css-files/

However, given this example:

test1.css:

#admin {
    background: #c9d2dc;
    border-color: #ccc
}

test2.css:

#admin {
    background: #222;
    border-bottom: 1px solid #444;
    border-left: 1px solid #444;
    padding: 2px;
    position: fixed;
    right: 0px;
    top: 0px;
    width: 120px;
    z-index: 2
}

It will only allow you to select one or the other. I want to merge them, making it:

#admin {
    background: #c9d2dc;
    border-color: #ccc
    border-bottom: 1px solid #444;
    border-left: 1px solid #444;
    padding: 2px;
    position: fixed;
    right: 0px;
    top: 0px;
    width: 120px;
    z-index: 2
}

Answer 1

The merger tool should give options for you when it spots the same id's/classes on different css files, but in this case it wouldn't allow you to merge them together. In example 1 you have the id "admin", with background set to #222. In example 2 the same id has a background designated as #c952dc. The merger can't put multiple attributes together, your css file wouldn't be valid. Each class/id, regardless of what file they exist on, should only have 1 instance of any particular attribute.