---
sourceDocument: Australia ServiceNow AI Platform user interface
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/pt-BR/platform-user-interface

 Release :

    - australia

ft:locale :

    - pt-BR

ft:publication_title :

    - Australia ServiceNow AI Platform user interface

ft:clusterId :

    - platux

bundleId :

    - platux

workflow :

    - Platform


---

# CSS for right-to-left languages in portals

# CSS for right-to-left languages in portals {#ariaid-title1}

* Versão de lançamento: Australia
* 
* Atualizado 12 de mar. de 2026
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 1 min. de leitura

You can control the generation of CSS for right-to-left languages using a variety of methods.
Base system portals besides Service Portal (/sp) and custom portals might need additional CSS customization to mirror the direction of a portal for right-to-left languages completely.  
Custom widgets might need some manual conversion for right-to-left languages.

* For inline styles in a widget's HTML template, move these styles to the widget's CSS so they'll be automatically converted.
* For internal styles in a widget's HTML template, you can use the `[dir="rtl"]` attribute selector or `.rtl` class selector to provide CSS that is specific to right-to-left languages.
* To include CSS that is specific to right-to-left languages, you can call the isRTLEnabled() method in the [GlideSPScriptable - Scoped](https://www.servicenow.com/docs/access?context=c_GlideSPScriptableScopedAPI&version=australia&pubname=australia-api-reference&ft:locale=en-US) class in a widget's server script or use the g_portal_isrtl global flag in the widget's client script.
{#css-directives-right-to-left-languages__ul_ctr_vrg_sxb}

Also, in the theme, page, widget, or widget instance CSS, you can add right-to-left directives to CSS properties only using a Sass interpolation string (`#{""}`).
{#css-directives-right-to-left-languages__table_ozm_lfy_rxb__entry__2}

| Right-to-left CSS directive | Description |
|-|-|
| `/*rtl:ignore*/` | Ignores the property when converting portal CSS for right-to-left languages. |
| `/*rtl:prepend:10px*/` | Adds a value to the beginning of the property value for right-to-left languages. This example prepends `10px`. |
| `/*rtl:append:3rem*/` | Adds a value to the end of the property value for right-to-left languages. This example appends `3rem`. |
| `/*rtl:replace:``30px``*/` or `/*rtl:``30px``*/` | Replaces the property value with the specified value for right-to-left languages. This example replaces the property value with `30px`. |
| `/*rtl:insert:25px*/` | Inserts the specified value in place of the directive for right-to-left languages. This example inserts `25px`. |
[Tabela 1. CSS directives for right-to-left languages]

{#css-directives-right-to-left-languages__table_ozm_lfy_rxb}  

## Ignore the transform property in the converted right-to-left CSS {#css-directives-right-to-left-languages__example_i1s_pfy_rxb}

    .fl {
    transform: rotate(45deg) translateY(5px) #{"/*rtl:ignore*/"};
    }


