How can I adjust space-between for Inline component children in Alpha Stack?

jaymitBeladiya
Shopify Partner
17 0 5

I'm using Inline component inside the Alpha Stack component. In this case align="space-between" not working so how can we set space-between to the Inline component's children.

Replies 4 (4)

Rahul3F
Excursionist
14 2 4

Hello,

 

can you please try the inline css

<AlphaStack align="center">
<Inline style={{ justifyContent: "space-between" }}>
<div>Child 1</div>
<div>Child 2</div>
<div>Child 3</div>
</Inline>
</AlphaStack>

Thanks

rahul
jaymitBeladiya
Shopify Partner
17 0 5

Hello,

Yes, tried but not working.

In Polaris component inline CSS not working 

Rahul3F
Excursionist
14 2 4

Please try one more

<AlphaStack align="center">
<div style={{ display: "flex", justifyContent: "space-between" }}>
<div>Child 1</div>
<div>Child 2</div>
<div>Child 3</div>
</div>
</AlphaStack>

rahul
jaymitBeladiya
Shopify Partner
17 0 5

Hi @Rahul3F ,

I also tried this one but still not working.