Why doesn't the 'next button' work in a smaller screen?

Question

I am trying to modify this code from site point, but I can't figure out why the 'next' button doesn't work in the screen size of 345px and below. What is the problem? I appreciate your help. Please see here for the complete code: https://codepen.io/SitePoint/pen/GmPjjL

<h1>Quiz on Important Facts</h1>
<div class="quiz-container">
  <div id="quiz"></div>
</div>
<button id="previous">Previous Question</button>
<button id="next">Next Question</button>
<button id="submit">Submit Quiz</button>
<div id="results"></div>

Answer 1

Because label tag overlap the button tag

Answer 2

It doesn't work because your previous label tag is overlapping the button tag.

Change the position of the button and apply z-index to fix it.

button{
  position: relative;
  z-index: 4;
}

New Codepen Link