<label class="txt">
<span class="txt-l">
Default
</span>
<input type="text" value="" placeholder="" class="txt-f">
</label>
<label class="txt">
<span class="txt-l">
Input Label
<span class="t--req">Required</span>
</span>
<input type="text" value="" placeholder="" class="txt-f">
</label>
<label class="txt">
<span class="txt-l">
Soft Require - Required/Validation on Submit
<span class="t--req">Required</span>
</span>
<input type="text" value="" placeholder="" class="txt-f txt-f--err txt-f--sr">
<div class="t--subinfo t--err m-t100">Please enter an email address</div>
</label>
<label class="txt">
<span class="txt-l">
Error
</span>
<input type="text" value=" Not an email address string" placeholder="Your email address" class="txt-f txt-f--err">
<div class="t--subinfo t--err m-t100">Please enter an email address</div>
</label>
Fleet supports creating form elements with explicit and implicit labels. The preferred use is to utilize explicit labelling if possible. According to the W3, explicit labelling is better supported by assistive technologies.