fix(css): enforce canonical order on border and outline pages (#34995)

fix(css): enforce canonical order on border and outlinen pages

files/en-us/web/css/border/index.md

@@ -15,9 +15,9 @@ The **`border`** [shorthand](/en-US/docs/Web/CSS/Shorthand_properties) [CSS](/en
 
 This property is a shorthand for the following CSS properties:
 
-- [`border-color`](/en-US/docs/Web/CSS/border-color)
-- [`border-style`](/en-US/docs/Web/CSS/border-style)
 - [`border-width`](/en-US/docs/Web/CSS/border-width)
+- [`border-style`](/en-US/docs/Web/CSS/border-style)
+- [`border-color`](/en-US/docs/Web/CSS/border-color)
 
 ## Syntax
 

files/en-us/web/css/outline-color/index.md

@@ -95,8 +95,7 @@ p {
 ## See also
 
 - {{cssxref("outline")}}
-- {{cssxref("outline-color")}}
-- {{cssxref("outline-style")}}
 - {{cssxref("outline-width")}}
+- {{cssxref("outline-style")}}
 - The {{cssxref("<color>")}} data type
 - Other color-related properties: {{cssxref("color")}}, {{cssxref("background-color")}}, {{cssxref("border-color")}}, {{cssxref("text-decoration-color")}}, {{cssxref("text-emphasis-color")}}, {{cssxref("text-shadow")}}, {{cssxref("caret-color")}}, and {{cssxref("column-rule-color")}}

files/en-us/web/css/outline-offset/index.md

@@ -80,6 +80,6 @@ p {
 ## See also
 
 - {{cssxref("outline")}}
-- {{cssxref("outline-color")}}
-- {{cssxref("outline-style")}}
 - {{cssxref("outline-width")}}
+- {{cssxref("outline-style")}}
+- {{cssxref("outline-color")}}

files/en-us/web/css/outline-style/index.md

@@ -244,5 +244,5 @@ The `auto` value indicates a custom outline style, described in [the specificati
 ## See also
 
 - {{cssxref("outline")}}
-- {{cssxref("outline-color")}}
 - {{cssxref("outline-width")}}
+- {{cssxref("outline-color")}}

files/en-us/web/css/outline-width/index.md

@@ -118,5 +118,5 @@ span {
 ## See also
 
 - {{cssxref("outline")}}
-- {{cssxref("outline-color")}}
 - {{cssxref("outline-style")}}
+- {{cssxref("outline-color")}}

files/en-us/web/css/outline/index.md

@@ -15,24 +15,24 @@ The **`outline`** [CSS](/en-US/docs/Web/CSS) [shorthand property](/en-US/docs/We
 
 This property is a shorthand for the following CSS properties:
 
-- {{cssxref("outline-color")}}
-- {{cssxref("outline-style")}}
 - {{cssxref("outline-width")}}
+- {{cssxref("outline-style")}}
+- {{cssxref("outline-color")}}
 
 ## Syntax
 
 ```css
 /* style */
 outline: solid;
 
-/* color | style */
-outline: #f66 dashed;
+/* style | color */
+outline: dashed #f66;
 
-/* style | width */
-outline: inset thick;
+/* width | style */
+outline: thick inset;
 
-/* color | style | width */
-outline: green solid 3px;
+/* width | style | color*/
+outline: 3px solid green;
 
 /* Global values */
 outline: inherit;
@@ -48,12 +48,12 @@ The `outline` property may be specified using one, two, or three of the values l
 
 ### Values
 
-- `<'outline-color'>`
-  - : Sets the color of the outline. Defaults to `invert` for browsers supporting it, `currentcolor` for the others. See {{cssxref("outline-color")}}.
-- `<'outline-style'>`
-  - : Sets the style of the outline. Defaults to `none` if absent. See {{cssxref("outline-style")}}.
 - `<'outline-width'>`
   - : Sets the thickness of the outline. Defaults to `medium` if absent. See {{cssxref("outline-width")}}.
+- `<'outline-style'>`
+  - : Sets the style of the outline. Defaults to `none` if absent. See {{cssxref("outline-style")}}.
+- `<'outline-color'>`
+  - : Sets the color of the outline. Defaults to `invert` for browsers supporting it, `currentcolor` for the others. See {{cssxref("outline-color")}}.
 
 ## Description
 
@@ -120,6 +120,7 @@ a:focus {
 
 ## See also
 
-- {{cssxref("outline-color")}}
-- {{cssxref("outline-style")}}
 - {{cssxref("outline-width")}}
+- {{cssxref("outline-style")}}
+- {{cssxref("outline-color")}}
+- {{Cssxref("border")}}