一个div里面包含两个div让两个div垂直居中

最新推荐文章于 2023-11-03 20:38:10 发布

囿于江湖

最新推荐文章于 2023-11-03 20:38:10 发布

阅读量838

点赞数

文章标签： javascript css 前端

本文链接：https://blog.csdn.net/dongheng123/article/details/127428700

版权

在这里插入图片描述

  <div class="tab-container">
            <div class="text-container">
              <div class="ft14">未设置项目经理项目数</div>
              <div class="ft22">59.29 </div>
              <div><span class="ft14">未设置率</span><span class="ft22" style="margin-left: 10px;">123</span></div>
            </div>
              <div class="apply-progress-key apply-progress-key1">
                <el-progress :percentage="42" :show-text="false"></el-progress>
              </div>
          </div>  

  .tab-wrapper{
    display: table;
    height: 33.33%;
     width: 100%;
  }
  .tab-container{
    width: 100%;
    height: 100%;
    display: table-cell;
    vertical-align: middle;
    .text-container{
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      margin-bottom: 10px;
    }
    .ft14{
      font-size: 14px;
      color: #FFFFFF;
    }
    .ft22{
      font-size: 22px;
      color: #FFFFFF;
    }
  }```
  其中重点内容是 一个table 父元素  再包一个 table-cell  再里面才是两个div  需要垂直居中的