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> ...