JSFiddle - React, Tailwind, and code Playground

by JThomas

HTML

<article>
    <section>
         <h2>Example showing you don't have to use the for attribute of an label element. You can simply add the control element inside the label element to assign the label to that control</h2>

    </section>
    <section>
        <div class="center-text">
             <h5>Example with for attribute used:</h5>

            <label for="control">My Control:</label>
            <input type="text" id="control" />
             <h5>Example with a nested control element:</h5>

            <label>My Control:
                <input type="text" />
            </label>
        </div>
    </section>
    <section>
         <h2>
            This is useful for creating custom skinned controls for the radio and checkbox
            input types.
        </h2>

    </section>
</article>

CSS

.center-text{
    text-align: center;
}