卡组件内部的中心标签

时间:2018-10-23 07:07:01

标签: reactjs

Look at This Image Something Like This 我正在使用Ant Design Template。我正在使用卡组件。卡内有一个标签。我想在卡片中央显示该标签,我该如何实现  这是我的代码

<Card style={{ height: 300, alignItems:Center, backgroundColor:'#344A54', justifyContent:'Center', alignItems:'Center'}} >
  <Input placeholder="Enter site name" style={{backgroundColor:'#344A54', border:0, marginTop:-100, marginLeft:-30}} />
  <Popover content={titlecontent} title="Title" trigger="hover">
    <label style={{fontSize:50,flex:5,alignSelf:'Center',textAlign:'center'}} contentEditable>
      Your page title
    </label>
  </Popover>
</Card>
<Card style={{ height: 300 ,alignContent:CurryRight}}>
</Card>

1 个答案:

答案 0 :(得分:0)

alignItems: 'center'justifyContent: 'center'仅适用于flexbox。因此,请尝试在卡片样式中添加display: 'flex'