Divider section
The Divider section of Combine draws a horizontal line between two sections, with its own width, style, color and margins.
Applies to: Combine 4.2.0 and later. Added in: Combine 2.4.0. Last checked: 2026-10-13 against Combine 4.2.0.
The Divider section draws a horizontal line between two sections, with its own thickness, width, style and margins. You can also use a small repeating image instead of a line.
Where to find it: in the theme editor, select Add section and choose Divider.
Line size
- Height sets the line thickness, 1 to 100 px (default 1 px). With Divider Image, it sets the height of the image strip.
- Fullwidth (on by default) runs the line from edge to edge of the screen. Turn it off to keep the line within the page width.
Divider Design
- Color sets the line color (default black).
- Style sets the line pattern: Solid (the default), Dotted, Dashed or Double. Patterns need a Height of 2 px or more to show.
- Divider Image replaces the line with an image repeated from left to right, for example a wave or a zigzag. Color and Style no longer apply.
Gutter
The Divider section has four margin settings, one more than most sections:
- Decrease top margin and Remove top margin shrink or remove the space above the line.
- Decrease bottom margin and Remove bottom margin shrink or remove the space below it.
The other margin settings work as described in General section styling.
What image works as a divider image?
A wide, short image that tiles: its right edge must continue its left edge. Upload it at twice the Height you set, for sharp high-density screens. The image is scaled to the Height you set and repeats across the width.
How do I put a line between blocks inside a card?
Use the Divider block in a flex section. The Divider section always takes a full row between two sections.
All Divider settings
Every setting of this section, with its type and default.
Height (slider 1 to 100 px, default: 1 px): Sets the line thickness, or the height of the Divider Image strip.
Fullwidth (checkbox, default: on): Runs the line from edge to edge of the screen; off keeps it within the page width.
Divider section: Divider Design
Where to find it: Divider → Divider Design
Color (color with transparency, default: rgba(0,0,0,1)).
Style (dropdown, default: Solid): Sets the line pattern. Dotted, Dashed and Double need a Height of 2 px or more to show. Options: Solid, Dotted, Dashed, Double.
Divider Image (image): Replaces the line with an image repeated from left to right, scaled to Height. Color and Style no longer apply.
Divider section: Gutter
Where to find it: Divider → Gutter
The Divider section uses the standard Gutter settings, listed in General section styling.
Decrease top margin (checkbox, default: off): Makes the space above the line smaller.
Remove top margin (checkbox, default: off): Removes the space above the line.
Remove bottom margin (checkbox, default: off): Removes the space below the line, so the next section touches it.
Decrease bottom margin (checkbox, default: off): Makes the space below the line smaller.
These settings differ from the standard ones or exist only here:
Remove top margin (checkbox, default: off): Removes the space above the line.
Decrease bottom margin (checkbox, default: off): Makes the space below the line smaller.
Related pages
- Divider block: a line between blocks inside a flex section.
- General section styling: the margin settings.
- Layout theme settings: the space between all sections.