Check box does not work if there is an anchor element in the label element

I wanted to put the a element of the in-page link in the label element so that the check box would switch with each movement in the page.

So first I wrote this code:

div {
  width: 100px;
  height: 50px;
  background: #121;
}

<input type="checkbox" id="correct">

<label for="correct">text</label>

<div></div>

<label for="correct">teeeext</label>

This was done by clicking on each label and switching the checkbox.

However, when I created a code with a link inside the label element, the check box stopped working.

div {
  width: 100px;
  height: 50px;
  background: #121;
}

<input type="checkbox" id="correct">

<label for="correct"><a href="#link1">not work!</a></label>

<div></div>

<label for="correct">work!</label>

<label for="correct"><a href="#link2">not work!</a></label>

As a result of the search, I found a similar question but no solution was written about using the in-page link.

javascript - <a> tag inside <label> tag not triggering checkbox - Stack Overflow

What CSS do I need to toggle the checkboxes when using in-page links within the label element?