Multistep form template problem, how to fix?

Hey! I would like to use this template (https://marketplace.weweb.io/projects/3466cb92-035b-4b48-9866-10fa61eb5ef0/) i found in the marketplace, but I would like to add an extra step. But when I try to add that extra step (from 3 steps to 4), the progress bars get messed up.

The original:

What I have now:

How do I get the progress bar I’m selecting to flush to the left?

Hi @raelyn !
I think that would fall under the parent’s properties. You can set its Justify property to flex-start and add some column-gap.
CleanShot 2024-08-15 at 09.21.10
And then, from how the component is built, you’ll need to adjust the Progress bars width and positioning.

Heyhey! So I tried to justify left but the second progress bar doesn’t seem to flush to the left still. Any suggestions? :slight_smile:

The parent container:

The progress bar:

You’ll need to tweak the left position of each Progress bar, using percentages to make it responsive :slight_smile:
CleanShot 2024-08-18 at 10.35.35

1 Like