Possible FlexBox Bug?



I’m attempting to create a horizontal layout with flexBoxes and I’m pretty sure I’m seeing a bug. (Please forgive me if I’m just misunderstanding something).

My FlexBox has alignItems set to center, and yet the items don’t center along the main axis as expected. I can force them to by specifying alignSelf as center on all individual items. But I wouldn’t expect that to be necessary.

C1, C2, C3, C4 all have width and height defined on their associated FlexItems and have flexShrink set to 0.0.

The FlexBox has the following properties:
flexDirection = row
flexWrap = noWrap
alignContent = stretch
alignItems = center
justifyContent = center


I’m assuming you meant that they don’t align along the cross axis.

I can’t reproduce the bug in the Juce Demo however the default settings for alignSelf on individual FlexItem objects is stretch which using the current settings of the FlexBox you provided will stretch the items along the cross-axis.

Try setting the alignContent to center while keeping the default alignSelf property on the FlexItem objects. Does that give you the desired behaviour?


Ah, you’re right. I missed that the default for alignSelf was stretch. Thank you! If I set it to autoAlign it does what I expect. I have to say though I would have expected the default to be autoAlign since the css property has ‘auto’ as its default.