行高和其他el-descriptions-item不一致

Question

由于是最后一行 只有一列 行高和其他el-descriptions-item不一致 有遇到过吗

      <el-descriptions-item label="意见" :rowspan="3">
        <div class="description-content">{{ evalobj.evalComments }}</div>
      </el-descriptions-item>

Answer 1

阿里嘎多学长整理AIGC生成，因移动端显示问题导致当前答案未能完全显示，请使用PC端查看更加详细的解答过程

问题分析

你遇到的问题是，使用 Element UI 的 el-descriptions-item 组件时，最后一行的行高与其他行不一致。这可能是由于 Element UI 的设计原因或是其他样式影响导致的。

解决方案

你可以尝试以下方法来解决这个问题：

1. 检查样式: 确保没有其他样式影响到 el-descriptions-item 的行高。可以使用浏览器的调试工具检查元素的样式。
2. 使用 el-descriptions-item 的 span 属性: 你可以尝试使用 el-descriptions-item 的 span 属性来设置行高。例如：

<el-descriptions-item label="意见" span="1">
  <!-- 内容 -->
</el-descriptions-item>

1. 使用 CSS 覆盖: 如果上述方法不起作用，可以尝试使用 CSS 覆盖来设置行高。例如：

.el-descriptions-item:last-child {
  line-height: 40px; /* 或者其他行高值 */
}

注意

上述解决方案仅供参考，具体情况可能需要根据你的项目实际情况进行调整。