
React Ant Design 组件 CSS 适配:卡片溢出修复
Ant Design 组件的嵌套结构有时会导致卡片溢出显示。本文将分析问题根源并提供解决方案。
问题分析:
Antd 组件使用嵌套结构,所有组件都包含在 ant-row 元素中。而 ant-row 元素默认 CSS 样式为 height: 0px;,这使得父容器高度为零,导致子组件无法自动调整高度。
解决方案:
为了解决卡片溢出,需要修改 ant-row 元素的 CSS 样式,使其高度自适应。 您可以添加如下样式:
.ant-row {
height: auto;
}
通过设置 height: auto;,容器将根据内部组件内容自动调整高度,从而避免卡片溢出。










