我尽力了。但它不起作用。我想使用 flexbox 使我的元素内联,代码如下:
<div style={{
flex: 1,
flexDirection: 'column',
justifyContent: 'center',
}}>
<div style={{width: 50, height: 50, backgroundColor: 'powderblue'}} />
<div style={{width: 50, height: 50, backgroundColor: 'skyblue'}} />
<div style={{width: 50, height: 50, backgroundColor: 'steelblue'}} />
</div>
我所做的一切,它只按列呈现。有人能救我一命吗?
最佳答案
如果你想让它们内联,你应该使用row
而不是column
:
<div
style={{
display: 'flex',
flexFlow: "row nowrap",
justifyContent: 'center',
}}
>
<div style={{width: 50, height: 50, backgroundColor: 'powderblue'}} />
<div style={{width: 50, height: 50, backgroundColor: 'skyblue'}} />
<div style={{width: 50, height: 50, backgroundColor: 'steelblue'}} />
</div>
flex
是子元素的属性。
关于css - flex 方向不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50435600/