1

I need to put the New button on the right, but I can't. What am I doing wrong?

<template>
    <lightning-layout class="slds-page-header slds-page-header_object-home">
        <lightning-layout>
        <lightning-layout-item>
            <lightning-icon icon-name="utility:work_order_type" alternative-text="Work Types"></lightning-icon>
        </lightning-layout-item>
        <lightning-layout-item padding="horizontal-small">
            <div class="page-section page-header">
                <h1 class="slds-text-heading_label">Work Types</h1>
                <h2 class="slds-text-heading_medium">Work Types</h2>
            </div>
        </lightning-layout-item>
        </lightning-layout>
        <lightning-layout horizontal-align="end">
            <lightning-button label="New" onclick={handleNew}></lightning-button>
        </lightning-layout>
    </lightning-layout>
</template>

enter image description here

2

Add the horizontal-align="spread" to the lightning layout to spread out the items to the left and right sides.

<template>
    <lightning-layout horizontal-align="spread" class="slds-page-header slds-page-header_object-home">
        <lightning-layout>
        <lightning-layout-item>
            <lightning-icon icon-name="utility:work_order_type" alternative-text="Work Types"></lightning-icon>
        </lightning-layout-item>
        <lightning-layout-item padding="horizontal-small">
            <div class="page-section page-header">
                <h1 class="slds-text-heading_label">Work Types</h1>
                <h2 class="slds-text-heading_medium">Work Types</h2>
            </div>
        </lightning-layout-item>
        </lightning-layout>
        <lightning-layout horizontal-align="end">
            <lightning-button label="New" onclick={handleNew}></lightning-button>
        </lightning-layout>
    </lightning-layout>
</template>

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.