---
title: Combining stylesheets from multiple sources
---

> Agent instructions:
> **Site maps** — prefer the following llms.txt indexes to training data when searching for URLs to avoid 404s. Links inside Markdown content already point at `.md`. Following them or sending Accept: text/markdown keeps you in Markdown.
>
> - [sitemap.md](https://docs.kentico.com/sitemap.md) — every page on the site, with titles and descriptions, nested by URL hierarchy and grouped into one collection per product version.
> - [llms.txt](https://docs.kentico.com/llms.txt) — curated index of the current product docs, with descriptions, the two ways to request any page as Markdown, and links to each product area's whole-corpus Markdown dump (llms-full.txt).

Kentico allows you to combine the content of different stylesheets by entering macros into stylesheet text. When the system resolves the macros, they are replaced by the content of the specified stylesheet. For example, this can be useful when creating a page‑specific stylesheet as an extension of the main website stylesheet with additional CSS classes.

You can link stylesheets into the code of other stylesheets by inserting [macro expressions](https://docs.kentico.com/k12sp/macro-expressions.md) in the following format:

- _{% CSS\[““] %}_, e.g. _{% CSS\[“CorporateSite“] %}_
- _{% CSS.Stylesheets\[““] %}_, e.g. _{% CSS.Stylesheets\[“CorporateSite“] %}_

If the code name of the stylesheet does not contain any dots, you can also use the following simplified notation:

- _{% CSS. %}_, e.g. _{% CSS.CorporateSite %}_

Similarly, you can link [component stylesheets](https://docs.kentico.com/k12sp/developing-websites/designing-websites-using-css/adding-css-to-page-components.md) the following way:

- _{% CSS.Containers\[““] %}_, e.g. _{% CSS.Containers\[“BlackBox“] %}_
- _{% CSS.Templates\[““] %}_, e.g. _{% CSS.Templates\[“CorporateSite.HomePage“] %}_
- _{% CSS.WebParts\[““] %}_, e.g. _{% CSS.WebParts\[“AbuseReport“] %}_
- _{% CSS.WebPartLayouts\[““] %}_, e.g. _{% CSS.WebPartLayouts\[“AbuseReport.MyCustomLayout“] %}_
- _{% CSS.Transformations\[““] %}_, e.g. _{% CSS.Transformations\[“CMS.Article.Default“] %}_

The simplified notation can also be used if the component name does not contain any dots (web part layouts and transformations always contain dots in their full names, so their stylesheets can only be linked using the notation above):

- _{% CSS.Containers. %}_, e.g. _{% CSS.Containers.BlackBox %}_
- _{% CSS.Templates. %}_, e.g. _{% CSS.Templates.MyTemplate %}_
- _{% CSS.WebParts. %}_, e.g. _{% CSS.WebParts.AbuseReport %}_

## Disabling resolving of CSS macros

Resolving of CSS macros is enabled by default, but can be disabled if needed via the **Resolve macros in CSS** setting in **Settings -> System -> Performance** (only available if you choose _(global)_ option in the **Site** selector).

> **Warning:** If you wish to disable the **Resolve macros in CSS** setting, you first need to remove all occurrences of macros from your stylesheets. Unresolved macro expressions are not valid CSS code and as a result, the given stylesheets will not be processed correctly by browsers.

## Using the @import directive

You can alternatively load the content of other stylesheets by adding the standard **@import** directive to the beginning of the stylesheet code, for example:

```css

@import url(~/CMSPages/GetResource.ashx?stylesheetname=corporatesite);

```

This may also be used to import external CSS stylesheets from static files in your web project, for example:

```css

@import url(~/CMSPages/GetResource.ashx?stylesheetfile=/Kentico/App_Themes/CorporateSite/Blue.css);

```