> For the complete documentation index, see [llms.txt](https://callum-hart.gitbook.io/immutable-styles/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://callum-hart.gitbook.io/immutable-styles/compiletimeerrors.md).

# Compile Time Errors

Immutable styles ships with a friendly compiler that helps assist development, rather than bark at you. If the compiler finds an error, such as a CSS override the compilation process is terminated and an error is thrown. Each error is documented below including the problem code and the error thrown.

## Invalid Attribute

When an invalid attribute is used.

```jsx
<p foo="invalidAttr">
  font-size: 20px;
</p>
```

The ruleset above throws an "Invalid Attribute" compile time error:

![](/files/-LSa_TRxSCHbil2tgkxR)

## Duplicate Property

When a CSS property is defined more than once in same block.

```jsx
<h1 className="title">
  color: darkslategray;
  font-size: 20px;
  color: burlywood;
</h1>
```

The ruleset above throws a "Duplicate Property" compile time error:

![](/files/-LSa_TRzX6lP0Uu7kcB4)

## Override Found

When one style overrides another style.

```jsx
<p className="child">
  color: darksalmon;
</p>,

<div className="parent">
  <p className="child">
    font-size: 10px;
    color: lightsalmon;
  </p>
</div>
```

The rulesets above throws an "Override Found" compile time error:

![](/files/-LSa_TS0nrFg2LWpOgeN)

## Partial Override Found

When one style partially overrides another style.

```jsx
<dl className="address">
  margin: 20px 10px;
</dl>,

<footer>
  <dl className="address">
    margin-left: 20px;
  </dl>
</footer>
```

The rulesets above throws a "Partial Override Found" compile time error:

![](/files/-LSa_TS2xCCjOTUERBcf)

## Nested Media Query

When a media query is nested inside another media query.

```jsx
<footer minWidth="900">
  padding: 0 30px;

  <p minWidth="300">
    font-size: 1rem;
  </p>
</footer>
```

The ruleset above throws a "Nested Media Query" compile time error:

![](/files/-LSa_TS46b4zvNEYqCdD)

## Element Property Mismatch

When an inheritable property is used by an invalid element type.

```jsx
<div>
  font-size: 1.4rem;
</div>
```

The ruleset above throws a "Element Property Mismatch" compile time error:

![](/files/-LSa_TS6S6EO8C2lxZl1)

*See* [*Strict Inheritance*](/immutable-styles/advancedconcepts/strictinheritance.md) *for more details.*