Return to Revisions

This question has probably been asked many times in different forums. The hidden label in the lightning:select is creating the additional space

Include class="slds-m-top_medium" in the lightning:layoutItem for the buttons. Also, include the verticalAlign="center" in the lightning:layout.

Code should be as follows:

<aura:component implements="flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId" access="global" >
    <aura:attribute name="buttonLabel" type="string" default="Search"/>    
    <aura:attribute name="isNewAvailable" type="boolean" default="true"/>
    
    <lightning:layout horizontalAlign="center" verticalAlign="center">
        <lightning:layoutItem padding="around-medium">
            <lightning:select name="select1" label="Car Types" value="" aura:id="carType" variant="label-hidden">
                <option value="" label="All Types"/>
                <option value="" label="Luxury Cars"/>
                <option value="" label="Sports Cars"/>
            </lightning:select>
        </lightning:layoutItem>
        
        <lightning:layoutItem  padding="around-medium" class="slds-m-top_medium">
            <lightning:button variant="brand" label="{!v.buttonLabel}"/>
            <aura:if isTrue="{!v.isNewAvailable}">
                <lightning:button variant="neutral" label="New"/>
            <aura:set attribute="else">
                New button cannot be added here!!
            </aura:set>
            </aura:if>
        </lightning:layoutItem>
    </lightning:layout>
         
</aura:component>