<link href="https://fonts.googleapis.com/css2?family=Kumbh+Sans&display=swap" rel="stylesheet">

<h1>tabindex 0</h1>
<ul> 
  <li> 
    <button>
      Click me, then tab once!
    </button>
  </li> 
  <li> 
    <div tabindex="0"> You're focused on a div now. Weird right? Tab again! </div> 
  </li>
  <li>
    <button> 
      Now you're in a button which seems normal. Tab again!
    </button>
  </li>
  <li>
    <h2 tabindex="0"> 
      You're now focused on an h2. Weird right?
    </h2>
  </li>
</ul> 
li {
  margin: 25px 0
}

body {
  font-family: 'Kumbh Sans', sans-serif;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.