Multi Line Text Variable Not Expanding to Full Width in Record Producer (Service Portal)

tabrez ahmed
Tera Contributor

 

Hi Everyone,

I am facing an issue in Service Portal with a Record Producer variable layout.

I have a Variable Set configured with containers and splits. The “Justification” field is a Multi Line Text variable with Variable Width set to 100%, but it still appears only in half width on the portal.

Current behavior:

  • The form is rendering in a fixed 2-column layout
  • The Justification field stays in the right-side column
  • Containers and Container Splits are not making it full width

What I tried:

  • Added separate containers
  • Added/removed Container Splits
  • Set Variable Width = 100%
  • Created separate container rows for Justification
  • Added dummy variables/labels for testing

But the field still remains half-width in Service Portal.

It seems the Variable Set “2 Columns” layout is overriding the container structure and forcing all variables into two fixed columns.

Has anyone faced this issue before?
Is there any way to make a Multi Line Text variable span the complete row/full width in Service Portal?

Attached screenshots for reference.

Thanks!

tabrezahmed_1-1778483589645.pngtabrezahmed_2-1778483642884.png

 

4 REPLIES 4

tabrez ahmed
Tera Contributor

tabrez ahmed
Tera Contributor

vaishali231
Kilo Sage

Hey @tabrez ahmed 

Solution 

Change the Variable Set Layout from:

2 Columns Wide, alternating sides

to:

Single Column

Then recreate the 2-column sections using:

  1. Container Start
  2. Container Split
  3. Container End

Example:

Requested For | Location

Start Date    | Return Date

Model

Justification (Full Width)

This is the cleanest and most stable approach in Service Portal.

Alternative: CSS Override

If you must keep the 2-column Variable Set layout, you can force the variable to full width using CSS.

Add the following CSS in:

  • Service Portal Theme CSS
    OR
  • Widget CSS
/* Force Justification variable to full width */

div[name="justification"] {

   width: 100% !important;

   max-width: 100% !important;

   flex: 0 0 100% !important;

   display: block !important;

   clear: both !important;

}
div[name="justification"] .form-control {

   width: 100% !important;

}

If needed, inspect the field using browser DevTools (F12). Usually the issue comes from the parent container being rendered as:

<div class="col-md-6">

In that case, overriding the Bootstrap column width may also help.

*************************************************************************************************************************************

If this response helps, please mark it as Accept as Solution and Helpful.

Doing so helps others in the community and encourages me to keep contributing.

Regards

Vaishali Singh

Servicenow Developer
Linkedin - https://www.linkedin.com/in/vaishali-singh-2273361bb

Tanushree Maiti
Kilo Patron

Hi @tabrez ahmed 

 

Just try it.

 

 

  • Right-click the field label on the form and select Configure Dictionary (or Variable).
  • Go to the Attributes tab (you may need to switch to Advanced View).
  • Add the following attribute:     is_multi_text=true

refer: KB0690810 Fields that share same storage alias with an edge-encrypted field get a multiple-line inpu...

 

Please mark this response as Helpful & Accept it as solution if it assisted you with your question.
Regards
Tanushree Maiti
ServiceNow Technical Architect
Linkedin: