Including a Stylesheet from Within Another Stylesheet

June 13th, 2011 - Posted by Steve Marks to (X)HTML / CSS, Web Development.

If you’ve got a stylesheet that is used in conjunction with other stylesheets on a regular basis did you know that you can include it within the CSS? Maybe you’ve got styles duplicated across multiple CSS files, in which case it might be better to put these duplicated classes into their own stylesheet. I find it a great way to keep all the CSS uniformed and clean on sites.

I’ve included below an example of how we can achieve this by importing a stylesheet:

@import "common.css";

body { font-family:Arial; }

# ... the remaining CSS

Note that the external CSS is referenced relative to the current stylesheet. In the above example if the common.css was in the directory above the stylesheet we’re including it from we could call it like ‘../common.css’.

This entry was posted on Monday, June 13th, 2011 at 9:38 pm by +Steve Marks and is filed under (X)HTML / CSS, Web Development. You can follow any responses to this entry through the RSS 2.0 feed.

Fear not, we won't publish this

Comments (1)
  1. dekaru says:

    Thanks for this tip!!