---
title: "document-scoped-selector"
description: "Reports a selector variant that styles the whole document instead of the element."
image: "https://stillwind.dev/og.png"
---

> Documentation Index
> Fetch the complete documentation index at: https://stillwind.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# document-scoped-selector

This rule reports a variant that replaces the element with a document-wide
target, such as `[:root]:`. Stillwind compiles CSS statically, so including this
declaration in your code affects the document even when the element is not
rendered.

## Reported

```tsx
style("[:root]:text-red-500");
```

> document-scoped-selector: `:root` does not depend on the styled element; declare document-wide CSS in a global stylesheet
> 
> Example:1:8

## Fixed

```css
:root {
  @apply text-red-500;
}
```

## How to fix

- To style the root of the page, write a rule in your stylesheet, as in the
  example.
- To style the element itself, remove the variant: `style("text-red-500")`.

## Rule settings

| Preset | Severity |
| --- | --- |
| `recommended` | deny |
| `strict` | deny |
| `stylistic` | off |

[Configure lint](/docs/configuration#lint) to change the severity or options.

Source: https://stillwind.dev/docs/lints/document-scoped-selector/index.mdx