Custom Widget Layout Issue in Employee Center When Switching to RTL (Hebrew)

[Tal5]

Hello everyone,

I’ve created a custom widget in the Employee Center using HTML, CSS, and JS.
When I switch the system language to Hebrew (RTL), the lines and layout in the widget shift out of place, breaking the design.
Interestingly, this issue does not occur in another environment where I tested the same widget, so I suspect it might be related to the request page settings or global CSS in the Employee Center.

Details:

• The widget was built using custom HTML, CSS, and JS.
• The problem only appears when the language is set to RTL (Hebrew).
• In another environment (with the same files), the widget displays correctly, even in Hebrew.
• I suspect the issue may be related to the request page configuration or some global CSS affecting RTL layouts.

What I’ve tried so far:

• Reviewed the widget’s HTML and CSS for RTL compatibility.
• Compared settings between the working and problematic environments.
• Tried adding specific CSS rules for RTL, but the issue persists.

Has anyone encountered a similar issue, or does anyone have suggestions or resources that might help me identify what’s causing the difference between environments and how to resolve it?

Thank you in advance for any help!

[RaghavSh]

So id it different across instances then you have some issue with CSS and css can be written at different places like

widget, widget instance, page specific css, css in portal theme, CSS includes in theme.

since your issue is not persistent across all instances so it is not related to language change.

Now for troubleshooting you need to compare all the places, mentioned above and inspect the portal page to see which css is conflicting.

[kaushal_snow]

Hi @Tal5 ,

This is a common challenge due to RTL language support nuances in ServiceNow.....

Utilize the isRTLEnabled() method in your widget's server script to detect RTL languages. Based on this, conditionally apply RTL specific CSS classes or styles in your widget's HTML or client script...Ensure that the theme settings and page configurations are consistent across environments. Pay particular attention to any overrides that might affect RTL rendering....If the issue persists after these steps, consider reaching out to ServiceNow Support for further assistance....

If you found my response helpful, please mark it as ‘Accept as Solution’ and ‘Helpful’. This helps other community members find the right answer more easily and supports the community.