Learn full-stack web development using fastn in a week
Learn Now

ftd.column

A column is a container component that stacks a list of children vertically.
ℹ️
column

Make sure to close your column container using the end syntax. This is mandatory.

-- end: <container-name>

Usage

-- ftd.column:

;; <Child components>

-- end: ftd.column
Lang:
ftd

Attributes

ftd.column accepts the container root attributes, container attributes as well all the common attributes.

Example

-- ftd.column:
spacing.fixed.px: 20

-- ftd.text: Hello

-- ftd.text: World

-- end: ftd.column
Lang:
ftd
In this example, a column container is created with a fixed spacing of 20 pixels between the child components. Two ftd.text components are then placed within the row, which will be vertically stacked with the specified spacing.
Output
Hello
World