Overview
The .ds-rows class (previously .ds-layout__rows) provides generic row layouts with options to implement fixed width child rows or columns.
The ds-rows class applied to a container element causes the containers child elements to display as a vertical list of horizontal rows, with a vertical gutter between each row. ds-rows is divided into 12 columns, with each row spanning all 12 columns (the full width of the container) by default.
Options
Basic usage
Indent
Indents the contents, this would generally be used on the main outer container of content.
Small
Medium (Default)
Large
Column width
As an alternative ds-cols in some situations, ds-rows can be used to display column content.
If a direct child element of ds-rows has a class of .ds-span --X where X is a value betwen 1-12 that child element will display at that width.
Adjacent child elements with a .ds-span --X value will act like columns without the need of wrapping those rows in a parent element.