element-plus走马灯不显示

问题描述

依赖正确,代码用法正确,但是element-plu走马灯就是不显示!!

js 复制代码
 <div class="content">
      <el-carousel height="150px" width="200px">
        <el-carousel-item v-for="item in 4" :key="item">
          <div class="h-100px w-100px">{{ item }}</div>
        </el-carousel-item>
      </el-carousel>
     
    </div>
  </div>



.content {
      display: flex;
      width: 750px;
      height: 256px;
      margin-top: 24px;
      margin-left: 16px;
      overflow: hidden;

      //   div {
      //     margin-left: 20px;
      //     &:first-child {
      //       margin-left: 0;
      //     }
      //   }
    }

并且盒子的宽度总是0


错误排查:

在现有的布局中插入官方的案例,也不能显示

但是把整个页面都使用官方案例就可以正常显示

所以,怀疑时自己的样式冲突了


解决方案:

就content一个盒子,看到 display: flex;就知道不对劲,去掉flex布局就正常了

相关推荐
猿榜33 分钟前
魔改编译-永久解决selenium痕迹(二)
javascript·python
阿幸软件杂货间37 分钟前
阿幸课堂随机点名
android·开发语言·javascript
我要让全世界知道我很低调1 小时前
记一次 Vite 下的白屏优化
前端·css
threelab1 小时前
three案例 Three.js波纹效果演示
开发语言·javascript·ecmascript
1undefined21 小时前
element中的Table改造成虚拟列表,并封装成hooks
前端·javascript·vue.js
用户7579419949701 小时前
基于JavaScript的简易Git
javascript
gzzeason2 小时前
使用Vite创建React初始化项目
前端·javascript·react.js
又双叒叕7782 小时前
React19 新增Hooks:useOptimistic
前端·javascript·react.js
归于尽2 小时前
V8 引擎是如何给 JS"打扫房间"的 ?
前端·javascript
自由逐风2 小时前
JS 处理长整型数字的坑:从雪花 ID 精度丢失说起
javascript