Horizontal alignment using the Lightning layout base component

In this section, we will create an application that demonstrates how to use Lightning:layout base components and achieve horizontal and vertical alignments.

Create a simple Lightning Application via the Developer Console and let's name the application LightningLayoutApp. Now copy the following code:

<aura:application extends="force:slds">    <Lightning:layout horizontalAlign="space">            <Lightning:layoutItem padding="around-small">               <Lightning:card title="1">                    <p class="slds-p-horizontal_small">                        Card 1                    </p>          </Lightning:card>            </Lightning:layoutItem>            <Lightning:layoutItem padding="around-small">                <Lightning:card title="2">                    <p class="slds-p-horizontal_small">                        Card 2                    </p> </Lightning:card> ...

Get Learning Salesforce Lightning Application Development now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.