A lightning:layoutItem defines content to display within lightning:layout . You can arrange one or more lightning:layoutItem components inside lightning:layout . Use the attributes of lightning:layoutItem to configure the size of the layout item, and change how the layout is configured on different device sizes.
The lightning:layout is a container type of component that contains lighting:layoutItem components. Together, the two components make up the grid system used to arrange and display the various elements within them. The grid system divides the lightning:layout into 12 equal columns