el-card高度溢出怎么解决

img


<template>
  <el-card style="min-height: 100%">
    <div slot="header" class="clearfix">
      <span>添加栏目span>
    div>
    <div>
      <el-scrollbar>
        <el-form label-width="200px">
          <el-col :span="16"
            ><el-form-item label="栏目名称">
              <el-input>el-input> el-col>
          <el-col :span="16"
            ><el-form-item label="索引名称">
              <el-input>el-input>
            el-form-item>
          el-col>
          <el-col :span="16"
            ><el-form-item label="栏目描述">
              <el-input>el-input> el-col>
          <el-col :span="16"
            ><el-form-item label="栏目关键字">
              <el-input>el-input> el-col>
          <el-col :span="16">
            <el-form-item label="栏目图片">
              <el-upload action="">
                <el-button plain>选取图片el-button>
              el-upload>
            el-form-item>
          el-col>
          <el-col :span="16">
            <el-form-item label="栏目组">
              <el-select>
                <el-option>el-option>
              el-select> el-col>
          <el-col :span="16">
            <el-col :span="6">
              <el-form-item label="添加栏目">
                <el-switch>el-switch>
              el-form-item>
            el-col>
            <el-col :span="6">
              <el-form-item label="添加内容">
                <el-switch>el-switch>
              el-form-item>
            el-col>
          el-col>
          <el-col :span="16">
            <el-form-item label="栏目内容"> el-form-item>
          el-col>
          <el-col :span="16">
            <el-form-item label="栏目内容"> el-form-item>
          el-col>
          <el-col :span="16">
            <el-form-item label="栏目内容"> el-form-item>
          el-col>
          <el-col :span="16">
            <el-form-item style="display: flex; justify-content: flex-end">
              <el-button type="primary">立即添加el-button>
              <el-button>取消el-button>
            el-form-item>
          el-col>
        el-form>
      el-scrollbar>
    div>
  el-card>
template>

<script lang="ts">
import { Vue, Component, Watch } from "vue-property-decorator";
import BaseView from "@/views/baseView";
import canAccessView from "@/utils/accessCheck";
import { ApiDescription, HttpMethod } from "@/utils/apiDescription";

@Component({
  components: {},
})
export default class add extends BaseView {}
script>

<style lang="scss" scoped>
.el-col {
  height: 100%;
}
style>

右边卡片高度溢出怎么解决,要与左边的卡片高度相等?

CSS样式用calc来写高度