How to center the Main header of the form

Now I have to align the main header in the center,

and I want to make sure the section collabs is visible when it's RTL

Hi ADD_info,

Thanks for reaching out to Jotform Support. To aligned the main header and sub header to center, you can Inject this CSS code below:

1. First, copy this code:

.form-header-group {

  text-align: center !important;

}

.form-header {

  text-align: center !important;

  width: 100%;

  display: block;

}

.form-subHeader {

  text-align: center !important;

}

2. In Form Builder, click on the Paint Roller icon on the right side of the page to open Form Designer.

3. Now, in the Form Designer menu, click on the Styles tab, scroll down and paste the code into the Inject CSS Code box. That’s it. The code is automatically saved.

Give it a try and let us know how it goes.

What about the section collabs?
Please check both laptop and mobile view

the text is overlapping with the arrow

Hi ADD_info,

You can move the arrow icon for Section Collapse to the left side so that it will not overlap with the text and remove it in mobile since there is not enough space for the text and arrow icon using the provided CSS code below.

.form-collapse-table:after {

right: 93% !important;

}





@media only screen and (max-width: 600px) {

.form-collapse-table:after {

display: none;

}

}

Results:

Give it a try and let us know how it goes.