Use the Row for columns element with Column elements to add columns to your layout, note that it is a Flex container.

Locating the row for columns element¶

To find the Row for columns element:

1. Navigate to a component or a template with the Layout canvas
2. Click the + button on the Layout canvas
3. Within the Elements tab, look for the Row for column element.

The Row for columns element includes the following fields:

Bleed columns¶

• Bleed - Set child columns to Bleed into gutters (have no separating gutters) or Retain gutters (include separating gutters).
• Overflow hidden - Use Overflow hidden to prevent horizontal scrollbars showing when the Row for columns is the parent container.

Markup and style target¶

• Target - Use Target to select which element to apply styles and markup too.
  • Inner container (coh-row-inner) - Applies markup and styles to the inner container class .coh-row-inner
  • Outer container (coh-row) - Applies markup and styles to the outer container class .coh-row

Custom style¶

• Layout style - Apply a Layout custom style to the Column. See more information on Applying styles to elements.

Match heights of children¶

Use Match heights of children to target and equalize the heights of child elements of your Row for columns.

• Target element - Target the element you want to apply the match height too.
  • None - Removes match heights at the specific breakpoint
  • Specific elements - Match heights of Container, WYSIWYG, Paragraph, Headings, Buttons, Links, Block quotes and Citations which are direct children of Row for columns
  • With class name - Match the heights of Elements with a specific class name
• Target level - Use Target level to select which element to apply match heights to if there are more than one of the same element type directly within the Row for columns or Column. 

For more information on Match heights, see Match the heights of elements.

Comments¶

• Add comments - Add comments to the Element.  For more information, see Adding comments to an element.