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?

1 Answer 1


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.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .