How to add a css file?

Squiz Matrix Support
1

How do I include a css file in a design file?

2

The simplest way is just like adding an image. Use the mysource_files/ virtual location and upload the CSS file as an "Associated File" of the design. You reference the CSS like this:


Note that you can't use mysource_files/ [i]inside[/i] a CSS file. If you need to reference images within your CSS, you have to add that to a <style> block at the top of the parsefile itself.
3

Hello-


Yeah I figga'd it out, wierd limitation though, and for css designers its actually kinda annoying, but the pros still out weigh the cons.



thanks.



kevin

4

There are a few ways around it. You can upload all the images, set them live, then modify your CSS to point to their __data URLs (tedious, but fast). Or you can use the CSS File asset to create parsable CSS files. The disadvantage here is that the CSS is created dynamically for each page view, so its slower.


Edited to add that the reason this is slower is because the CSS cannot be cached on the client, due to its dynamic nature. Thus, there is a processing overhead while Matrix generates the CSS and a transfer overhead for every page view to grab the CSS.