::details-content

An experimental pseudo-element that specifically targets the content part of a <details> element (the part that expands and collapses).

Quick example

details::details-content {
  /* Styles the expandable content area directly */
  padding: 10px;
  background-color: #f9fafb;
  border: 1px solid #e5e7eb;
}

::details-content Browser Support

Newly available Since 2025 83% global usage

Since 2025 this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Works in all modern browsers. May need a fallback for older browsers.

131+
143+
18.4+
131+
ESC