The layoutItem has attributes to specify the size of different device types. To further understand this, consider the following markup code. Use the Developer Console to create a Lightning Component, copy the markup, and preview the application to observe the output. For this, shrink your browser window to observe the output.
The code is as follows:
<aura:application extends="force:slds"> <Lightning:layout verticalAlign="start" multipleRows="true"> <Lightning:layoutItem flexibility="auto" smallDeviceSize="6" mediumDeviceSize="4" largeDeviceSize="3" padding="around-small" size="12"> <Lightning:card title="1"> <p class="slds-p-horizontal_small"> Card 1 </p> </Lightning:card> </Lightning:layoutItem> ...