如何让div自动填充高度

如图

结构：

<el-link :underline="false"
                 :href=item.url
                 style="height:100%;">
          <el-col :span="12">
            <el-image :src="item.backgroundUrl"
                      fit="cover"
                      class="background"></el-image>
          </el-col>
                    <!-- 想让这个div自动填充高度 -->
          <el-col :span="12"
                  style="height:100%;display: flex;justify-content: center;align-items: center;">
            <span>{{item.name}}</span>
          </el-col>
        </el-link>

我设置了高度100%，但是不好用啊？请问大家这是什么原因？

考虑应用场景了没有，记得好多地方不可以100%

el-link加上display: flex;
第二个el-col加上flex: 1试试看

把el-link设置弹性布局 display:flex; align-items:center 试试看呢
如果有帮助，请采纳√

你是要图片和文字居中对齐吗？试试下面的

.el-link--inner {
display:flex;
align-items: center;
}