[css-pseudo-4] Add a note about applying box-decorating styles on ::details-content. #12845

Author: tabatkins

css-pseudo-4/Overview.bs

@@ -1666,16 +1666,25 @@ Expandable contents of details element: the ''::details-content'' pseudo-element
     when the <{details}> element opens:
 
     <pre class="lang-css">
-details::details-content {
-  opacity: 0;
-  transition: content-visibility 300ms allow-discrete, opacity 300ms;
-}
-
-details[open]::details-content {
-  opacity: 1;
-}</pre>
+      details::details-content {
+        opacity: 0;
+        transition: content-visibility 300ms allow-discrete, opacity 300ms;
+      }
+
+      details[open]::details-content {
+        opacity: 1;
+      }</pre>
   </div>
 
+  Note: The default UA stylesheet styles a closed ''::details-content''
+  with ''content-visibility: hidden'',
+  so the contents are still considered present for the purpose of find-in-page
+  and similar features.
+  This, however, only suppresses the display of the pseudo-elements's <em>contents</em>;
+  if margin, borders, etc are set on the pseudo-element, they'll still be visible.
+  Use ''[open]::details-content'' to apply these styles if that's undesirable.
+
+
 <h2 id="interactions">
 Overlapping Pseudo-element Interactions</h2>