title: EsLint rule for label
body: <p>i have a problem </p>
  
  <p><img src="https://i.stack.imgur.com/HDnlc.png" alt="My image"></p>
  
  <p>My esLint rules:</p>
  
  <pre><code>"jsx-a11y/label-has-for": [ 2, {
        "components": [],
        "required": {
          "every": [ "nesting", "id" ]
        },
        "allowChildren": true
      }],
  </code></pre>
  
  <p>I want just for off this error, or fix, help me please</p>
  
  <p>Error msg: A form label must be associated with a control. (jsx-a11y/label-has-associated-control)</p>
  
  <p>JSX code:  </p>
  
  <pre><code>          &lt;input
                  type="checkbox"
                  id="checkbox-2"
                  className="checkbox__input"
              /&gt;
              &lt;label
                  htmlFor="checkbox-2"
                  className="checkbox__label"
              /&gt;
  </code></pre>