Luke Melia

software dev

October 2, 2005

Chaining CSS files with @import

Here’s the situation: Sharepoint allows me to specify one single custom stylesheet for a portal site. But I want to modularize my web parts so they are self-contained with a separate css file containing the styles required for it to render properly. A conundrum…

Together with my colleague Keith, we found out that you can chain stylesheets together using @import. So, for a fictional HelloWorld web part, I would have a HelloWorld directory installed in the root of the portal site, and it would contain a file called hello.css. Then I would include instructions to add a single line to the top of the portal site’s custom css file:

@import url("/HelloWorld/hello.css");

Not sure about browser support of this spec, but I know that IE 6/Win, the target for our intranet, handles it correctly.

Leave a Reply created 1999. ··· Luke Melia created 1976. ··· Live With Passion!