Skip to content
Bricks Academy
Get Bricks

Tabs (nestable)

The Nestable Tabs element allows creating tabbed content with drag-and-drop nesting in the builder.

Settings

Section titled “Settings”

  • Direction (direction) - Layout direction of the tabs. Controls the flex-direction CSS property. Set “ID” on tab menu “Div” to open a tab via anchor link (no spaces, no pound sign).

  • Open tab on (select) - Trigger for opening tabs. Options: click, hover. Default: click.

  • Open tab index (text) - Index of the tab to expand on page load, starting at 0. Default: 0.

Title

Section titled “Title”

  • Width (number with units) - Width of tab titles. Default: auto.

  • Margin (spacing) - Margin around tab titles.

  • Padding (spacing) - Padding inside tab titles. Default: 20px (top, right, bottom, left).

  • Background (color) - Background color of tab titles.

  • Border (border) - Border styling for tab titles.

  • Typography (typography) - Font styling for tab titles.

Active

Section titled “Active”

  • Background color (color) - Background color of active tab titles. Default: #dddedf.

  • Border (border) - Border styling for active tab titles.

  • Typography (typography) - Font styling for active tab titles.

Content

Section titled “Content”

  • Margin (spacing) - Margin around tab content.

  • Padding (spacing) - Padding inside tab content. Default: 20px (top, right, bottom, left).

  • Text color (color) - Text color of tab content.

  • Background color (color) - Background color of tab content.

  • Border (border) - Border styling for tab content. Default: 1px solid (all sides).