I am trying to replace the field label for a lightning-input-field element.

<label class="slds-form-element__label">Label Here</label>
<lightning-input-field class="application-field" id="Discipline_Disclosure__c" field-name="Discipline_Disclosure__c" variant="label-hidden"></lightning-input-field>

When I apply the variant "label-hidden", however, the styling of the element is changed and is now not horizontally aligned with the elements above and below it, as seen below.

enter image description here

Pictured are two lightning-input-field elements with the variant "label-hidden" and one regular lightning-input-field element.

Is there a reason this is happening? And, how can I get the "label-hidden" elements to line up with their base variant counterparts?


That's because Original Field Name which is hidden is still using the space on the layout and which is why input text box came to next line.

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.