Re: [csswg-drafts] [mediaqueries-5] `prefers-interaction-direction` media query & `interaction-direction` property (#10244)

>But the flexible layouts themselves may be an issue. If a site is coded with the navigation on top and the user sets it as preference for the bottom, what does the reading and focus order look like?

@nattarnoff Reading order often remains unchanged when using features like this, and follows the flow of the order of elements in the DOM.

For example, the reading order of the content here remains "form ➞ main" regardless of their visually rendered order:

```html
<div id="wrapper">
  <form id="login">…</form>
  <main>
    …
  </main>
</div>
```
```css
#wrapper {
  display: flex;
}
main {
  flex: 1;
}

@media (prefers-interaction-direction: right) {
  main {
    order: -1;
  }
}
```
<sup>See example: https://codepen.io/brandonmcconnell/pen/NWmozxO/8b53be8b61fbb92d6223e1b70c3d9922</sup>

-- 
GitHub Notification of comment by brandonmcconnell
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/10244#issuecomment-2075656485 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Wednesday, 24 April 2024 19:12:03 UTC