Semantic correct of using <header> element inside Calendar component #9567
Unanswered
lyhoang-web-dev
asked this question in
Q&A
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Uh oh!
There was an error while loading. Please reload this page.
-
In the Calendar documentation, the example code uses a
<header>element to wrap the navigation controls (previous/next buttons and month/year selectors):Concern
According to the HTML specification, the
<header>element represents introductory content for its nearest ancestor sectioning content (<article>,<section>,<aside>,<nav>) or sectioning root (<body>).Since
<Calendar>renders as a<div role="group">(not a sectioning element), using<header>inside it might not be semantically correct and could potentially confuse assistive technologies.Questions
<header>instead of a neutral<div>in the Calendar examples?<header>is used inside the Calendar?<div>be an equally valid (or more semantically correct) alternative?Environment
react-aria-componentsversion: 1.14.0Thank you for your clarification! 🙏
Beta Was this translation helpful? Give feedback.
All reactions