diff --git a/scss/_utilities.scss b/scss/_utilities.scss
index e22935d827..35a67d3fd3 100644
--- a/scss/_utilities.scss
+++ b/scss/_utilities.scss
@@ -195,14 +195,7 @@ $utilities: map-merge(
3: 3,
4: 4,
5: 5,
- 6: 6,
- 7: 7,
- 8: 8,
- 9: 9,
- 10: 10,
- 11: 11,
- 12: 12,
- last: 13,
+ last: 6,
),
),
// Margin utilities
diff --git a/site/content/docs/4.3/layout/grid.md b/site/content/docs/4.3/layout/grid.md
index df606e2224..0da95311fe 100644
--- a/site/content/docs/4.3/layout/grid.md
+++ b/site/content/docs/4.3/layout/grid.md
@@ -543,7 +543,7 @@ You may also apply this break at specific breakpoints with our [responsive displ
### Order classes
-Use `.order-` classes for controlling the **visual order** of your content. These classes are responsive, so you can set the `order` by breakpoint (e.g., `.order-1.order-md-2`). Includes support for `1` through `12` across all five grid tiers.
+Use `.order-` classes for controlling the **visual order** of your content. These classes are responsive, so you can set the `order` by breakpoint (e.g., `.order-1.order-md-2`). Includes support for `1` through `5` across all five grid tiers.
{{< example >}}
@@ -552,7 +552,7 @@ Use `.order-` classes for controlling the **visual order** of your content. Thes
First, but unordered
-
+
Second, but last
@@ -563,7 +563,7 @@ Use `.order-` classes for controlling the **visual order** of your content. Thes
{{< /example >}}
-There are also responsive `.order-first` and `.order-last` classes that change the `order` of an element by applying `order: -1` and `order: 13` (`order: $columns + 1`), respectively. These classes can also be intermixed with the numbered `.order-*` classes as needed.
+There are also responsive `.order-first` and `.order-last` classes that change the `order` of an element by applying `order: -1` and `order: 6`, respectively. These classes can also be intermixed with the numbered `.order-*` classes as needed.
{{< example >}}
diff --git a/site/content/docs/4.3/migration.md b/site/content/docs/4.3/migration.md
index 59c0c8af6f..3db2a451fb 100644
--- a/site/content/docs/4.3/migration.md
+++ b/site/content/docs/4.3/migration.md
@@ -96,6 +96,7 @@ Badges were overhauled to better differentiate themselves from buttons and to be
## Utilities
- Renamed `.text-monospace` to `.font-monospace`
+- Decreased the number of responsive order utilities per breakpoint. The highest order utility with a number now is `.order-5` instead of `.order-12`. [See #28874](https://github.com/twbs/bootstrap/pull/28874).
- **Todo:** Drop `.text-hide` as it's an antiquated method for hiding text that shouldn't be used anymore
- **Todo:** Split utilities into property-value utility classes and helpers
diff --git a/site/content/docs/4.3/utilities/flex.md b/site/content/docs/4.3/utilities/flex.md
index 244fc2198c..5c199871ec 100644
--- a/site/content/docs/4.3/utilities/flex.md
+++ b/site/content/docs/4.3/utilities/flex.md
@@ -423,7 +423,7 @@ Responsive variations also exist for `flex-wrap`.
## Order
-Change the _visual_ order of specific flex items with a handful of `order` utilities. We only provide options for making an item first or last, as well as a reset to use the DOM order. As `order` takes any integer value (e.g., `5`), add custom CSS for any additional values needed.
+Change the _visual_ order of specific flex items with a handful of `order` utilities. We only provide options for making an item first or last, as well as a reset to use the DOM order. As `order` takes any integer value from 0 to 5, add custom CSS for any additional values needed.
{{< example >}}
@@ -438,7 +438,19 @@ Responsive variations also exist for `order`.
{{< markdown >}}
{{< flex.inline >}}
{{- range $bp := $.Site.Data.breakpoints -}}
-{{- range $i, $num := seq 0 12 }}
+{{- range $i, $num := seq 0 5 }}
+- `.order{{ $bp.abbr }}-{{ $i }}`
+{{- end -}}
+{{- end -}}
+{{< /flex.inline >}}
+{{< /markdown >}}
+
+Additionaly there are also responsive `.order-first` and `.order-last` classes that change the `order` of an element by applying `order: -1` and `order: 6`, respectively.
+
+{{< markdown >}}
+{{< flex.inline >}}
+{{- range $bp := $.Site.Data.breakpoints -}}
+{{- range $i := slice "first" "last" }}
- `.order{{ $bp.abbr }}-{{ $i }}`
{{- end -}}
{{- end -}}