使用Element-ui 模板 ,el-submenu ,下拉框第一个数据鼠标点击时出现一条空隙。
源代码:
在这里插入代码片
<template slot="title">
<i class="el-icon-setting"></i>
<span slot="title">系统管理</span>
</template>
<el-menu-item-group>
<el-menu-item index="/a/roles">角色管理</el-menu-item>
<el-menu-item index="/a/users">用户管理</el-menu-item>
</el-menu-item-group>
</el-submenu>
这是由于有一个外联样式,
.el-menu-item-group__title:padding: 7px 0 7px 20px;
解决方式:
.el-menu-item-group__title:padding:height:auto !important;
但是必须要把本页面中的scoped去除,方可实现效果,如果不去除scoped ,后面的导航样式会在这个下拉菜单展开时,被挤下去。