自学内容网 自学内容网

关于el-card的height设置100%后, el-card内容超出高度后,内容被隐藏这件事

1. 解决方法

全局样式添加以下代码

.el-card__body{
height: 100%;
width: 100%;
}

2. 问题原因

代码

<el-card style="height: 100%">
<!-- ... -->
</el-card>

选中.el-card 元素发现这里的 .el-card overflow:hidden
在这里插入图片描述
而内部 .el-card__body除了padding外并未设置其他
在这里插入图片描述
所以el-card__body的宽高, 由内容决定, 当内容超过了el-card设置的高度后就会出现内容被隐藏的问题,

所以给el-card__body一个不超过el-card的宽高问题就可以解决


原文地址:https://blog.csdn.net/Angel_Tears_/article/details/142590017

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!