How to align all buttons left?

[Patric]

Hi

I need your help guys, I am struggling with the buttons element. I can’t get them simply aligned to the left.

I want to have a list of buttons, created by a query loop, and all buttons shall be aligned starting from the left towards to the right.

This is how it should look like, i.e. row 1 is how I want it to be. Row 2 is how it currently looks with my query loop and the button element:

As you can see in row 2, the buttons spread across the screen instead of being left aligned.

These are my settings:

I just can’t get the buttons to align left.

Does anybody have any idea what I am doing wrong?

Thanks

Patric

[aslotta]

Hey Patric,

like this?

You can see all the settings I used on the screenshot. No specific settings on the div and the button. Please try to use a div instead of the block for the query loop.

If it still does not work it’d be great if you could share a URL. Then I’m happy to have a look at what’s wrong on your end.

Best,

André

[Patric]

Hi André

thanks again, now it works!

Based on your screen-shot, I converted the block to a div and set Flex wrap: wrap in the container. That did it.

It’s embarassing, but I just could not get it without your help.

Interestingly, once I converted the block to a div, it worked right away. But when I converted the div back to a block just for fun, I could not get it to align left again.

Anyway, thanks for your help as always

Patric

[aslotta]

Hey Patric,

glad I could help. In contrast to the div element the block element has a width of 100% by default. I think this is the problematic bit in this situation.

Best,

André

[Patric]

Ok, that makes sense.

Cheers

Patric