Summary multi-column

Hello @bakhshi

Yes, of course, it is simply CSS. The summary fields include pair of predefined class names assigned to the fields’ labels and values:

summary-field-title

and

summary-field-value

You can replace them with the class names you want through the settings of summary field.

So, you can enter the style definition below, into the “Customize Form Design” attribute in the “Form Settings” tab (https://cff.dwbooster.com/images/documentation/form-settings-tab.png) to display the summary as an unique row:

#fbuilder .summary-field-title,
#fbuilder .summary-field-value{float:left; clear:none;}
#fbuilder .summary-field-value{margin-right:40px;}

Editing the CSS rules you can give them the appearance you want to the summary.

Best regards.

Thankful
Works fine on web page.
But how do I create this style on the print page?

Hello @bakhshi

Please, define the CSS rules with the !important; modifier.

Best regards.

what is the class name?

Hello @bakhshi

My recommendation was to define the CSS rules in the styles I sent you previously, with the !important; modifier.

#fbuilder .summary-field-title,
#fbuilder .summary-field-value{float:left !important; clear:none !important;}
#fbuilder .summary-field-value{margin-right:40px !important;}

If you need additional help customizing the form’s appearance, you should contact us through our private website: Custom Coding Service

Best regards.