bug: input with label wrong html code

[michaelcozzolino]

What version of FlyonUI are you using?

No response

Which browsers are you seeing the problem on?

All browsers

Reproduction URL

https://flyonui.com/docs/forms/file-input/#label

Describe your issue

the snippet provided, even if fully working is not completely right:

<label class="form-control w-96">
  <div class="label">
    <span class="label-text">Full name</span>
  </div>
  <input type="text" placeholder="John Doe" class="input" />
</label>

should be

<div class="form-control w-96">
  <label class="label">
    <span class="label-text">Full name</span>
  </label>
  <input type="text" placeholder="John Doe" class="input" />
</div>

some other snippets are affected as well.

[github-actions]

Hi @michaelcozzolino

Thank you for your support in helping us improve FlyonUI!

We’ve received your submission and will respond within few business days. Our team handles issues one at a time, and we’ll be reviewing yours as soon as possible.

In the meantime, any additional details or a reproducible example would be greatly appreciated and will help us resolve the issue more efficiently.

Thank you for your patience and understanding!

[OmkarOza]

Hi @michaelcozzolino,

Thank you for your feedback. The reason we used the first method, wrapping the entire form control in a <label>, was to handle a more complex layout. This approach ensures that all label-related elements, including additional spans and helper texts, are directly tied to the input field, allowing for a seamless user experience. It also enhances click behavior, making any part of the label area focus the input, and simplifies the HTML structure by avoiding redundant for and id attributes.

[michaelcozzolino]

understood, but according to the html specification that html you used is not valid as described here

furthermore according to your reason, both codes shown on the docs should be the same in terms of structure

but they are not. is it wanted?