WCM tip #29: You can’t use media queries on CSS references


When referencing CSS files in HTML files used with Design Manager CSS media queries are removed from the link tag.

The new Design Manager offers you an easy way to implement your custom user experience in SharePoint 2013. Using your static HTML files as starting point, it allows you to piece by piece extend them with dynamic controls linked to SharePoint web content management functionality.

The static HTML files that you will be using as the input for Design Manager contain references to CSS files. If your custom user experience uses responsive web design, those CSS references will contain media queries. Unfortunately Design Manager currently doesn’t support media queries on the CSS references and as a result they will be removed in the generated Master Page. If you want to use media queries in your CSS files you will need to include them in the contents of the CSS files rather than having separate CSS files for the different media queries.

Others found also helpful: