About This HTML Issue
The hidden attribute on a div (or any HTML element) does not accept "true" as a value. It is either a boolean attribute with no value, or it accepts the specific strings "", "hidden", or "until-found".
The hidden attribute controls whether an element is relevant to the page. When present as a plain boolean attribute (e.g., <div hidden>), the browser hides the element entirely and removes it from the accessibility tree. Setting hidden="true" is invalid because "true" is not one of the allowed states defined in the HTML specification.
The valid states are:
- An empty string (
"") or the keyword"hidden", both of which map to the "hidden" state. The element is not rendered and is excluded from the accessibility tree. - The keyword
"until-found", which hides the element visually but allows the browser to reveal it if the user searches for content within it (e.g., via Ctrl+F) or navigates to a fragment targeting it.
Since hidden is an enumerated attribute with these specific allowed values, "true" is treated as an invalid value. Most browsers happen to hide the element anyway when they encounter an unrecognized non-empty value, but the markup is still non-conforming.
Examples
Invalid: using hidden="true"
<div hidden="true">This content is hidden.</div>
Valid: using the boolean attribute or a valid keyword
<!-- Boolean attribute with no value -->
<div hidden>This content is hidden.</div>
<!-- Explicit "hidden" keyword (equivalent to the above) -->
<div hidden="hidden">This content is hidden.</div>
<!-- Hidden until found by in-page search or fragment navigation -->
<div hidden="until-found">This content is hidden until found.</div>
Find issues like this automatically
Rocket Validator scans thousands of pages in seconds, detecting HTML issues across your entire site.