From: Julien Déramond <juderamond@gmail.com>
Date: Mon, 9 Jun 2025 11:57:57 +0000 (+0200)
Subject: Docs: enhance floating labels `placeholder` usage description (#41526)
X-Git-Tag: v5.3.7~4
X-Git-Url: http://git.ipfire.org/gitweb/gitweb.cgi?a=commitdiff_plain;h=f04b980e7468804444bd5a849fda7525893a21b8;p=thirdparty%2Fbootstrap.git

Docs: enhance floating labels `placeholder` usage description (#41526)
---

diff --git a/site/src/content/docs/forms/floating-labels.mdx b/site/src/content/docs/forms/floating-labels.mdx
index 642ee8cb1f..dd2db0813e 100644
--- a/site/src/content/docs/forms/floating-labels.mdx
+++ b/site/src/content/docs/forms/floating-labels.mdx
@@ -6,7 +6,11 @@ toc: true
 
 ## Example
 
-Wrap a pair of `<input class="form-control">` and `<label>` elements in `.form-floating` to enable floating labels with Bootstrap’s textual form fields. A `placeholder` is required on each `<input>` as our method of CSS-only floating labels uses the `:placeholder-shown` pseudo-element. Also note that the `<input>` must come first so we can utilize a sibling selector (i.e., `~`).
+Wrap a pair of `<input class="form-control">` and `<label>` elements in `.form-floating` to enable floating labels with Bootstrap’s textual form fields.
+
+A non-empty `placeholder` attribute is required on each `<input>` as our CSS-only floating label implementation relies on the `:placeholder-shown` pseudo-element to detect when the input is empty. The placeholder text itself is not visible; only the `<label>` is shown to users.
+
+Also note that the `<input>` must come first so we can utilize a sibling selector (i.e., `~`).
 
 <Example code={`<div class="form-floating mb-3">
     <input type="email" class="form-control" id="floatingInput" placeholder="name@example.com">