I have a base CSS file named base.css and component level CSS file named header.css. When the page is compiled in AEM, the resultant CSS file has base.css appended after header.css, which causes all my custom header CSS to be overwritten by the base css.
I'm not sure where to change the order of file processing in AEM. Please help.
If both files belong to the same clientlib, you can affect their order in the resulting CSS by modifying the css.txt file. It should be just next to the CSS files themselves and it lists them all by relative path.
If the CSS files come from different client libraries, you can try introducing a dependency between the clientlibs, as explained here.
However, the fact that the order is relevant may be a sign that your CSS selectors are not specific enough. If I were you, I'd try improving the CSS itself before modifying the order in which the files are loaded. Using specific CSS classes for different elements of your page would give you a lot more control over the design.
