I'm working on some critical style revisions for a client's WordPress site that was designed by another team.
The CSS seems to be a tangled mess. One of the idiosyncrasies I've found is that the theme's main stylesheet
style.css, @imports another stylesheet from a subdirectory:
default.css @imports the main stylesheet at the top of its file too.
I removed the @import directives and added the content of the
style.css, but that breaks the layout regardless of whether I put the
default.css styles at the top or bottom of the
style.css file. The @import loop does something to the cascade that somehow makes the layout "work".
I have never seen anything like this before. It seems obvious that I should untangle the stylesheets and sequence the selectors in order of increasing specificity. But is there any reasonable rationale for deliberately creating two CSS files that @import each other? It seems nuts, but is it possible there's a principled reason behind this?
I specialize in front-end development, not WordPress development. I note that WordPress parses the main theme stylesheet for theme information. Is the @import recursion something that's useful to WordPress in any way?