From 0ac7e2881ed037a3b5ec2bce846f84e36f2cb871 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Fri, 10 Oct 2025 10:02:18 -0700 Subject: [PATCH] Improve display docs, remove print display utils --- scss/_utilities.scss | 1 - site/src/content/docs/utilities/display.mdx | 29 ++++----------------- 2 files changed, 5 insertions(+), 25 deletions(-) diff --git a/scss/_utilities.scss b/scss/_utilities.scss index cdaf3dad97..f8e1b080ab 100644 --- a/scss/_utilities.scss +++ b/scss/_utilities.scss @@ -92,7 +92,6 @@ $utilities: map.merge( // scss-docs-start utils-display "display": ( responsive: true, - print: true, property: display, class: d, important: true, diff --git a/site/src/content/docs/utilities/display.mdx b/site/src/content/docs/utilities/display.mdx index ce19d79ee4..f17fb3133e 100644 --- a/site/src/content/docs/utilities/display.mdx +++ b/site/src/content/docs/utilities/display.mdx @@ -1,6 +1,6 @@ --- title: Display property -description: Quickly and responsively toggle the display value of components and more with our display utilities. Includes support for some of the more common values, as well as some extras for controlling display when printing. +description: Quickly and responsively toggle the display value of components and more with our display utilities. toc: true reference: - class: d-none @@ -36,6 +36,9 @@ reference: - class: d-inline-flex styles: display: 'inline-flex' + - class: d-contents + styles: + display: 'contents' - class: d-flow-root styles: display: 'flow-root' @@ -74,7 +77,7 @@ The media queries affect screen widths with the given breakpoint *or larger*. Fo ## Clearfix -There's no more clearfix helper in v6 as it's an outdated technique. Instead, use the `display: flow-root` utility, `.d-flow-root`. This forces a container element to create a new block formatting context without the clearfix. +There's no more clearfix helper in Bootstrap 6 as it's an outdated technique. Instead, use the `display: flow-root` utility, `.d-flow-root`. This forces a container element to create a new block formatting context without the clearfix.
Floated element
@@ -118,28 +121,6 @@ To show an element only on a given interval of screen sizes you can combine one hide on lg and wider screens
hide on screens smaller than lg
`} /> -## Display in print - -Change the `display` value of elements when printing with our print display utility classes. Includes support for the same `display` values as our responsive `.d-*` utilities. - -- `.d-print-none` -- `.d-print-inline` -- `.d-print-inline-block` -- `.d-print-block` -- `.d-print-grid` -- `.d-print-inline-grid` -- `.d-print-table` -- `.d-print-table-row` -- `.d-print-table-cell` -- `.d-print-flex` -- `.d-print-inline-flex` - -The print and display classes can be combined. - -Screen Only (Hide on print only) -
Print Only (Hide on screen only)
-
Hide up to large on screen, but always show on print
`} /> - ## CSS ### Sass utilities API