reactjsantdant-design-pro

How to align center text or div item with Ant Design Space in Reactjs?


How to align text or div item center horizontal with Space with Ant design ?
Here is my code: 
import { Space } from 'antd'

<Space direction="horizontal" align="center" style={{width: '100%'}}>
  <span>Hello</span>
</Space>
Solution

  • Because Antd uses flex for Space div, you need to use justifyContent. Try this

    <Space direction="horizontal" style={{width: '100%', justifyContent: 'center'}}>