Bootstrap Col Shortcode

June 29, 2023 2 min read Shortcode Docs Layout Col

Shortcode to generate grid column.

On this page

Donate

Syntax

1{{% bs/col %}}
2BODY
3{{% /bs/col %}}

Parameters

`size`

Position	Name	Type	Required	Default	Since
`#0`	`size`	`string`	-	-	-

The space-separated column sizes, in [size] and [breakpoint]:[size] forms, such as 12, 12 md:6 lg:3.

`offset`

Position	Name	Type	Required	Default	Since
`#1`	`offset`	`string`	-	-	-

The space-separated column offsets, in [offset] and [breakpoint]:[offset] forms, such as 0, 0 md:1 lg:2.

Available options: [size], [breakpoint]-[size].

`class`

Position	Name	Type	Required	Default	Since
`#2`	`class`	`string`	-	-	-

Extra CSS classes.

Examples

Equal Width Columns Example

1{{% bs/container %}}
2{{% bs/row class="text-center" %}}
3{{% bs/col class="border py-3" %}}Col{{% /bs/col %}}
4{{% bs/col class="border py-3" %}}Col{{% /bs/col %}}
5{{% bs/col class="border py-3" %}}Col{{% /bs/col %}}
6{{% bs/col class="border py-3" %}}Col{{% /bs/col %}}
7{{% /bs/row %}}
8{{% /bs/container %}}

Col

Specified Width Columns Example

1{{% bs/container %}}
2{{% bs/row class="text-center" %}}
3{{% bs/col class="border py-3" size="12 md:6 lg:3" %}}Col{{% /bs/col %}}
4{{% bs/col class="border py-3" size="12 md:6 lg:3" %}}Col{{% /bs/col %}}
5{{% bs/col class="border py-3" size="12 md:6 lg:3" %}}Col{{% /bs/col %}}
6{{% bs/col class="border py-3" size="12 md:6 lg:3" %}}Col{{% /bs/col %}}
7{{% /bs/row %}}
8{{% /bs/container %}}

Col

Columns Example with Offset

1{{% bs/container %}}
2{{% bs/row class="text-center" %}}
3{{% bs/col class="border py-3" size="6 md:4" %}}Col{{% /bs/col %}}
4{{% bs/col class="border py-3" size="6 md:4" offset="md:4" %}}Col{{% /bs/col %}}
5{{% /bs/row %}}
6{{% /bs/container %}}

Col

Row

Browse Docs