element-ui组件 el-menu导航菜单边缘不对齐

el-menu 边缘不对齐

问题:
element-ui组件 el-menu导航菜单边缘不对齐_第1张图片
原因:

el-menu组件样式有右侧边框属性,属性如下
border-right: solid 1px #e6e6e6;

导致第一级的菜单实际宽度减小1px导致了边缘不对齐。

解决:

全局设置如下样式即可

// 全局 解决el-menu边缘不对齐问题
.el-menu {
  border: none !important;
}

也可以单独再组件内scoped内设置该样式,这样可以不用 !import 了。

你可能感兴趣的:(前端,vue.js,elementui)