1 | # [postcss][postcss]-ordered-values
|
2 |
|
3 | > Ensure values are ordered consistently in your CSS.
|
4 |
|
5 |
|
6 | ## Install
|
7 |
|
8 | With [npm](https://npmjs.org/package/postcss-ordered-values) do:
|
9 |
|
10 | ```
|
11 | npm install postcss-ordered-values --save
|
12 | ```
|
13 |
|
14 |
|
15 | ## Example
|
16 |
|
17 | Some CSS properties accept their values in an arbitrary order; for this reason,
|
18 | it is entirely possible that different developers will write their values in
|
19 | different orders. This module normalizes the order, making it easier for other
|
20 | modules to understand which declarations are duplicates.
|
21 |
|
22 | ### Input
|
23 |
|
24 | ```css
|
25 | h1 {
|
26 | border: solid 1px red;
|
27 | border: red solid .5em;
|
28 | border: rgba(0, 30, 105, 0.8) solid 1px;
|
29 | border: 1px solid red;
|
30 | }
|
31 | ```
|
32 |
|
33 | ### Output
|
34 |
|
35 | ```css
|
36 | h1 {
|
37 | border: 1px solid red;
|
38 | border: .5em solid red;
|
39 | border: 1px solid rgba(0, 30, 105, 0.8);
|
40 | border: 1px solid red;
|
41 | }
|
42 | ```
|
43 |
|
44 |
|
45 | ## Support List
|
46 |
|
47 | For more examples, see the [tests](src/__tests__/index.js).
|
48 |
|
49 | * `animation`, `-webkit-animation`
|
50 | * `border(border-left|right|top|bottom)`
|
51 | * `box-shadow`
|
52 | * `outline`
|
53 | * `flex-flow`
|
54 | * `transition`, `-webkit-transition`
|
55 |
|
56 |
|
57 | ## Usage
|
58 |
|
59 | See the [PostCSS documentation](https://github.com/postcss/postcss#usage) for
|
60 | examples for your environment.
|
61 |
|
62 |
|
63 | ## Contributors
|
64 |
|
65 | See [CONTRIBUTORS.md](https://github.com/cssnano/cssnano/blob/master/CONTRIBUTORS.md).
|
66 |
|
67 |
|
68 | ## License
|
69 |
|
70 | MIT © [Ben Briggs](http://beneb.info)
|
71 |
|
72 | [postcss]: https://github.com/postcss/postcss
|