0

This is what I have now, I spent 4 hours trying to bring these controls on each row to same baseline, but it doesn't work for me enter image description here

Here is my code:

 <div class="slds-grid slds-grid_vertical slds-grid_gutters slds-media_center" style="background-color: aquamarine;">
        <div class="slds-grid slds-align_absolute-center">
            <div class="slds-col slds-size_1-of-2">
                <input class="slds-input" data-id="amountInBaseCurrency" type="number" placeholder="0.00" value={amountInBaseCurrency} onchange={handleBaseCurrencyAmountChange}></input>
            </div>
            <div class="slds-col slds-size_1-of-2">
                <lightning-combobox data-id="selectedBaseCurrency" options={ratesAsComboboxOptions} value={baseCurrency} onchange={handleSelectedBaseCurrencyChange}>
                </lightning-combobox>
            </div>
        </div>

        <div class="slds-grid slds-align_absolute-center">
            <div class="slds-col slds-size_1-of-2">
                <input class="slds-input" data-id="amountInQuoteCurrency" type="number" placeholder="0.00" value={amountInQuoteCurrency} onchange={handleQuoteCurrencyAmountChange}></input>
            </div>
            <div class="slds-col slds-size_1-of-2">
                <lightning-combobox data-id="selectedQuoteCurrency" options={ratesAsComboboxOptions} value={quoteCurrency} onchange={handleSelectedQuoteCurrencyChange}>
                </lightning-combobox>
            </div>
        </div>
    </div>

I would appreciate for a solution, especially if it doesn't involve hardcoded css (i.e. using only slds)

1 Answer 1

1

<lightning-*> elements come with a "label" by default. To get rid of these labels, use variant="label-hidden", as in:

<lightning-combobox variant="label-hidden" data-id="selectedQuoteCurrency" options={ratesAsComboboxOptions} value={quoteCurrency} onchange={handleSelectedQuoteCurrencyChange}>
</lightning-combobox>

You must log in to answer this question.

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