PageCol Component Reference

Related documents

• Component Overview
• Component Reference
• Built-in Components
• Template Markup Language (TML) Reference
• Page Component Reference
• Card Component Reference
• RowCard Component Reference

Table of Contents

• Introduction
• Attributes
• Children
• DOM element properties
• Styling

Introduction

Syntax

tml`
	<Page>
		<PageCol>
			column 1 content
		<PageCol>
		<PageCol>
			column 2 content
		<PageCol>
	</Page>
`

The PageCol component organizes Page Component content into columns. On narrow devices, the columns are displayed serially. On wide devices, the columns are displayed side by side. Using PageCol allows balanced column content since the Page area is logically infinite.

By default, the styling only allows a one or two column layout.

Attributes

• Standard properties
  The Card component accepts the standard attributes.

Children

All template children are included as the PageCol component children.

DOM element properties

• The PageCol Component will render a <div> with the component children as its children.
• The <div> will have a CSS class name with the string pageCol.

Styling

By default, the PageCol <div> will span the width of the viewport on narrow devices and span half the width of the viewport on wide devices with a small butter between them.