OOTB Widget text overflowing on custom page layout
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
a week ago
I am currently in the process of building a new Employee Center portal. As part of this, I've created a custom 2:5:5 column layout in a flex container to meet the business requirement. In first column, we have an icon link and My Active Items widgets. These resize and display perfectly in full window widescreen (desktop) and in half- window (tablet) layout. The issue I need to solve is that, when the browser window width is resized smaller but not enough to trigger the tablet layout i.e. it's in-between the fixed sizes, the text on the icon link and My Active Items overflows the widget.
My ideal solution to this would be to update the breakpoint values to account for this custom layout i.e. tablet layout is up to 1280 instead of 1080. I've researched this and can't find a viable way to change it, I'm led to believe these values are locked in ServiceNow core code.
I've tried creating a CSS Include that would force the tablet value to trigger the smaller layout however this didn't appear to work. I may not have done it correctly or it's simply not possible as JS uses browser tools to lock in the values for the portal on resize.
I would prefer to keep the widgets OOTB.
Does anybody have any ideas or solutions on how this may be solved?
