4 ms·

Nice! https://jsfiddle.net/5gevzft8/1/ https://jsfiddle.net/5gevzft8/1/ Looks like you cannot use a button in the dialog then though. As it somehow makes the

• derefr 4y ago
  Your "cannot use" is my "element has proper accessibility consideration for people who are viewing the dialog inside a webview that disables scrolling." With the buttons always starting in scrolled-into-view and in focus, those people can at least dismiss the modal!
• MrJohz 4y ago
  This is the spec behaviour - the browser focus should immediately jump to the first focusable item in the page for accessibility reasons. (As I understand it, this is the norm for dialogs outside the browser.) My understanding is that you should be doing two things here: firstly, dialogs shouldn't generally be scrollable by themselves (or if they are, the interaction buttons should be sticky so that they're always visible). Instead, if you've got long text (say T&Cs) that should be in a scrollable box of its own. This allows the user to see the whole dialog (interactions and all) at once. Secondly, if there is something that should take focus before the buttons do, then you should set autofocus on that element explicitly. So in this case, you'd wrap the long text in a scrollable div, and add an "autofocus" attribute to that div to ensure that keyboard based users will immediately jump to it and be able to scroll it with their keyboard.