To make sure that properties do not get accidentally duplicated in a rule, they should be alphabetically ordered. Note that vendor-prefixed properties are expected to be ordered without taking into account their prefix.

This rule applies to all statement blocks (rulesets, @-rules,[begin-less] mixins,[end-less][begin-scss] mixins, nested properties,[end-scss] etc.).

## Noncompliant Code Example

    /* Noncompliant: 'color' should be defined after 'border-color' */
    .mybox {
      background-color: blue;
      color: red;
      border-color: green;
    }

    /* Noncompliant: '*color' should be defined after 'border-color' */
    .mybox {
      background-color: blue;
      *color: red;
      border-color: green;
    }

    /* Noncompliant: '_color' should be defined after 'border-color' */
    .mybox {
      background-color: blue;
      _color: red;
      border-color: green;
    }

    /* Noncompliant: '-xxx-background-color' properties should be defined before 'background-color' */
    .mybox {
      all: unset;
      background-color: blue;
      color: red;
      -moz-background-color: 10px;
      -ms-background-color: 10px;
    }

## Compliant Solution

    .mybox {
      background-color: blue;
      color: red;
      color: green;
    }

    .mybox {
      background-color: blue;
      *color: red;
      width: 10px;
    }

    .mybox {
      background-color: blue;
      _color: red;
      width: 10px;
    }

    .mybox {
      all: unset;
      -moz-background-color: 10px;
      -ms-background-color: 10px;
      background-color: blue;
      color: red;
    }

[begin-less]

## Exceptions

Less interpolated properties are not taken into account. For instance, the following piece of code does not raise an issue:

    .mybox {
      @{foo}: blue;
      color: white;
      @{bar}: red;
    }

[end-less] [begin-scss]

## Exceptions

SCSS interpolated properties are not taken into account. For instance, the following piece of code does not raise an issue:

    .mybox {
      #{$foo}: blue;
      color: white;
      #{$bar}: red;
    }

[end-scss]

## stylelint Related Rules

- declaration-block-properties-order