Salesforce Developers PDII Question # 2 Topic 1 Discussion

The requirement is for the Lightning web component to display in one column on phones and in two columns on larger devices. To achieve this, we should specify the size attributes for different devices using the design tokens provided by the Lightning Design System.

Option B is correct because size="6" will set each lightning-layout-item to take up half the available space (since the grid system is based on a 12-column structure), creating two columns on tablets, desktops, and larger devices. small-device-size="12" will ensure that on small devices like phones, each item will take up the full width, resulting in a single column.

Options A, C, and D do not meet the requirement correctly, as they either do not set the size correctly for small devices or do not specify the sizes for both small and larger devices appropriately.

References:

Lightning Design System Grid Documentation: Lightning Grid