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

tabrez ahmed
Tera Contributor

3 weeks ago

 

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

 

0 Helpfuls
  • 608 Views
5 REPLIES 5

tabrez ahmed
Tera Contributor

3 weeks ago

@Ankur Bawiskar

 

0 Helpfuls

tabrez ahmed
Tera Contributor

3 weeks ago

@Sandeep Rajput 

0 Helpfuls

vaishali231
Kilo Sage

3 weeks ago

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

0 Helpfuls

vaishali231
Kilo Sage
In response to vaishali231

3 weeks ago

hey @tabrez ahmed 

Hope you are doing well.

Did my previous reply answer your question?

If it was helpful, please mark it as correct ✓ and close the thread . This will help other readers find the solution more easily.

 

Thankyou & Regards

Vaishali Singh

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

 

0 Helpfuls