ant-design add extraStyle property in Card component

l2osamch 于 2022-10-23 发布在其他

关注(0)|答案(5)|浏览(226)

I have searched the issues of this repository and believe that this is not a duplicate.

it's would be nice to have extraStyle property in Card component (to edit padding...) and not only a size property

<Card
...
extra="content"
extraStyle={{ padding:0 }}
>

5条答案

<Card
  ...
  extra={<div style={{ padding:0 }}>content</div>}
  ...
/>

<Card
  ...
  extra={<div style={{ padding:0 }}>content</div>}
  ...
/>

It's giving that :

He wants to control the ant-card-extra . For example, it is align to right, it's by design. If custom really necessary, overwriting it.

Any news on this issue? Really need this change

For anyone searching for a solution until this feature exists, you can hack it with custom css.
E.g. you can give your Card a custom class name:

<Card
    className='card-extra-no-padding'
    extra={<span>I won't have any padding!</span>}
/>

Then in some imported css file use:

.ant-card.card-extra-no-padding .ant-card-extra {
  padding: 0;
}