An interesting problem we’ve faced recently was that one one of our sites, our FlexNav based mobile menus were being forced to display even on large devices when advanced css aggregation was switched on.

When we switched it off to investigate the problem, it was magically resolved. Turn it back on again, and FlexNav breaks. On some pages of the site, the menus displayed as expected even when aggregation was switched on, though that might have been because those pages were more heavily cached.

After a couple of hours' head scratching it was fixed with a lucky guess. We went to Configuration > Development > Performance > Advanced Aggregation and switched off the *Combine CSS files using media queries option, which seems to have done the trick.

Haven’t seen much related to this on Google, so we thought we’d better write something down in case it can help anyone else. We’re still not sure exactly what caused the issue, hence why we haven’t created an issue on drupal.org as yet, if you can shed any light on the subject then please drop us a comment or a tweet @willhallonline.

Edit 30/03/2015: The Flexnav module for Drupal has been under quite a bit of development lately and it seems that this issue has been resolved. Kudos to the project maintainers. The project can be found here: http://www.drupal.org/project/flexnav