-
kdaaka1908Answered on June 21, 2021 11:47 PM
Can you tell me how to add a line break? In the referenced form, I want to break the line between Send-Off and August 14. Thanks!
Page URL: https://form.jotform.com/211718702764154 -
sevki JotForm DeveloperAnswered on June 22, 2021 01:25 AM
Hi kdaaka1908,
You can do it by following the steps below.
1) Click on the "Form Designer" button on the right side of your page.
2) You will reach the relevant page by clicking the "Advanced Designer" button from the opened section.
3) On this page, more detailed settings can be made about your form. Select the "CSS" section on the right and click on the area with the line to see that that area is selected. After clicking, paste the line we have given you below in the field that opens on the right.
.form-buttons-wrapper.form-buttons-auto.jsTest-button-wrapperField {
bottom-top: none;
}
4) After performing these operations, you can save the changes you have made by clicking the "Save changes" button. To reach your form, you can reach your form by clicking the "Back to builder" button above the save changes button.
Preview:
Please do not hesitate to contact us if you require any further assistance.
-
kdaaka1908Answered on June 26, 2021 10:47 AM
Sevki,
I asked about breaking the line in the header between Off and August. You gave me a response re: a border on the button. Can you review and resend the relevant guidance? Thanks!
-
sevki JotForm DeveloperAnswered on June 26, 2021 02:52 PM
Sorry for the misunderstanding.
For the transactions in the 3rd and 4th items I mentioned above, it will be sufficient to perform the following operation.
.form-header-group.header-large {
border-bottom: none;
}
Please do not hesitate to contact us if you require any further assistance.
-
allenfam97Answered on June 26, 2021 03:23 PM
I don't think I'm being clear. Let's try this. Currently, the header looks like this:
Matthew's College Send-Off August 14
at 12:00pm (Rain Date: Aug. 15)
I want it to look like this, with the second line of text starting with August 14:
Matthew's College Send-Off
August 14 at 12:00pm (Rain Date: Aug. 15)
-
Patrick_RAnswered on June 27, 2021 03:11 AM
Hello! Our apologies for the inconvenience. Adding line breaks in header elements isn't supported. But there is a workaround to achieve this, i.e. to use the paragraph element as these elements allow formatting.
As an example, please check this form: https://www.jotform.com/211771546418963. Following is how the header should look like in this form:
If this solves your purpose, then you can remove your form's header element; add a paragraph element at its place (as indicated in the screenshot below) and from the source code view, add the following code; then save.
<div class="form-header-group header-large" style="margin-top:-20px;">
<div class="header-text httac htvam">
<h1 id="header_1" class="form-header" data-component="header">
Matthew's College Send-Off<br />August 14 at 12:00pm (Rain Date: Aug. 15)
</h1>
<div id="subHeader_1" class="form-subHeader">
Please RSVP and let us know whether you will attend.
</div>
</div>
</div>
Let us know if you come across any issues.
Thank you!