Primeng CascadeSelect UI显示BUG解决方案

最近在使用primeng@11.3.1, 里面的CascadeSelect,但是当我把它宽度设置为100%的时候出现了一个bug

问题

可以看到在第二级子菜单的时候,已经显示超出屏幕了.再加上二级子菜单的文字是左对齐,根本看不到任何子,但为了页面统一,我有不能单独把这个position宽度调低.

解决

于是去dom里面去寻找,发现了个解决方案

:host ::ng-deep {.p-cascadeselect .p-cascadeselect-panel {min-width: 60%;}
}

在scss里面添加这段,这.p-cascadeselect-panel clas是子菜单的对应class,默认是100%.调小之后就可以解决问题了

Primeng CascadeSelect UI显示BUG解决方案相关推荐

vue中使用baidushare分享到微信无法显示bug解决方案
vue中使用baidushare分享到微信无法显示bug解决方案参考文章: (1)vue中使用baidushare分享到微信无法显示bug解决方案 (2)https://www.cnblogs.co ...
关于WPS目录导航以及文章章节导航显示BUG解决方案
第一次写博客,写的不好请大家包涵由于工作需要写更新一篇文章,导航和文章章节目录出现了问题,总是显示不全. 查阅了各种各样的资料都没有一个解决办法,都是关于目录导航栏的问题以及解决方案,后来自己摸索出 ...
Win10系统下软件UI显示不完整解决方案
Win10系统下软件UI显示不完整解决方案参考文章: (1)Win10系统下软件UI显示不完整解决方案 (2)https://www.cnblogs.com/wxjnew/p/5079726.htm ...
SAP CRM Fiori 应用和 SAP Commerce Cloud (电商云) UI 如何通过调整 CSS 来改变UI显示风格
这是Jerry 2021年的第 19 篇文章,也是汪子熙公众号总共第 290 篇原创文章. 本文分别针对 SAP CRM Fiori 应用和 SAP Commerce Cloud (电商云) UI,介 ...
苹果隐藏app_iOS14隐藏功能，很实用！附部分BUG解决方案
昨日早些时候,苹果发布了新的iOS14,带来了一众的有趣新功能,详见:iOS14新功能一览:附描述文件. 受篇幅及时效性的限制,我们也只在推送中分享了部分新功能,后经实际体验我们又有了一些有趣的新发现 ...
React Native Text 组件显示不全解决方案
github上此问题的讨论传送门 BUG 体现效果(左出问题安卓真机,右ios模拟器) 设置 minWidth 无法自动撑开 View,除非 minWidth 设置得大些发生场景这个解决方法不一 ...
VUE引用外部字体tff及常见bug解决方案
1. 引用字体步骤 1.1 web.base.conf.js 文件需要有解析tff文件的规则,在module:{ rules:{}}中插入代码 {test: /\.(woff2?|eot|ttf|ot ...
android:ellipsize=end 不起作用,Android应用开发Android TextView关于android:ellipsize=end的一个神奇bug解决方案...
本文将带你了解Android应用开发Android TextView关于android:ellipsize=end的一个神奇bug解决方案,希望本文对大家学Android有所帮助. 疑惑今天在开发过 ...
Xamarin XAML语言教程将XAML设计的UI显示到界面
Xamarin XAML语言教程将XAML设计的UI显示到界面如果通过XAML将UI设计好以后,就可以将XAML中的内容显示给用户了,也就是显示到界面上.由于创建XAML文件方式的不同,所以将XAM ...

Primeng CascadeSelect UI显示BUG解决方案

问题

解决

Primeng CascadeSelect UI显示BUG解决方案相关推荐

最新文章

热门文章