Google does not recognize a Label linked to input

Asked

Viewed 32 times

-3

The google accessibility rules say that every input has to have a label. Ok!

I happen to be putting the attribute for equal to id input, but Google still accuses in the Lighthouse report that the input has no associated label.

Here’s an example that Google doesn’t recognize:

<div class="boxCampoPu">
  <input id="puNome" type="text" class="puNome" placeholder="Digite seu nome">
  <label for="puNome"> Insira seu nome</label>
</div>

Can anyone explain why this occurs?

google

1 answer

1

Probably not this item.

I ran your code in the local Lighthouse and could not play.

Follow the html I used:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>title</title>
  </head>
  <body>
    <div class="boxCampoPu">
      <input id="puNome" type="text" class="puNome" placeholder="Digite seu nome">
      <label for="puNome"> Insira seu nome</label>
    </div>
  </body>
</html>

The score for this code on accessibility is 100%:

Follow the print:

inserir a descrição da imagem aqui

Information from Chrome:

Version 88.0.4324.190 (Official version) 64 bits

  • I just did that. Same result.

  • What do you mean it’s not from this item? Are you saying that the id does not match for? It got a bit confusing.

  • Yes. I posted the code and the result. What’s confusing? Couldn’t reproduce your problem. What wasn’t clear? I posted the html code and the result.

Browser other questions tagged google

You are not signed in. Login or sign up in order to post.