Problem/Motivation

While the grid system provided by Bootstrap Layout Builder is useful for a lot of potential block layouts it fails when you need to stack blocks or their contents horizontally with a repeatable amount of space between them.

Example:
You have 3 blocks which contain dynamic content. If you create a section with 3 columns and place a block in each you will get 3 sections which stretch to fit the column. But your dynamic content sometimes does not stretch to fit. Images, buttons, links, etc. Now you have large spaces between each item when you wanted them all stacked horizontally with a predictable space between then.

Example:
You have a dynamic block which can contain any number of images in it. You want to display them horizontally. You cannot, they will be displayed with a line break between each of them. You will need to create a template to display them horizontally.

Proposed resolution

Create a style plugin for both sections and blocks that allows stacking the elements inside it using the stacks helper in bootstrap. Allow setting a gap value to space elements. https://getbootstrap.com/docs/5.3/helpers/stacks/

Comments

rhovland created an issue. See original summary.

rhovland’s picture

Issue summary: View changes
rhovland’s picture

Issue summary: View changes
rhovland’s picture

Version: 2.0.x-dev » 1.2.x-dev