-
gen81465Asked on July 21, 2018 at 8:16 PM
I am building one of my forms, and I added CSS code to center the Back and Next buttons. The problem arises as I want to center the custom text on #form-pagebreak-next_80 , which would be different from the centering on all other pagebreaks.
The CSS code I used for normal centering is:
.form-pagebreak
{
width: 22%;
margin-left: auto;
margin-right: auto;
}Note: I found that 22% is the ideal amount for centering a standard Back and Next button combination, based on the standard form width.
I tried to use the following CSS code to change the specific formatting of the one pagebreak, but it doesn't seem to work:
.form-pagebreak-back_80
{
width: 100%;
margin-left: auto;
margin-right: auto;
}.form-pagebreak-next_80
{
width: 100%;
margin-left: auto;
margin-right: auto;
}Any suggestions? And as always, thank you for the excellent help you provide.
George (gen81465)
Page URL: https://form.jotform.com/82013943875158 -
Elton Support Team LeadReplied on July 21, 2018 at 8:41 PM
Use this :
#cid_80 .form-pagebreak {
width: 100%;
}
#cid_80 .form-pagebreak-next-container {
width: 100%;
text-align: center;
}
#cid_80 .form-pagebreak-back-container {
display: none;
}
Result:
-
gen81465Replied on July 21, 2018 at 10:43 PMThanks for the help. That solution only works if I don't include the CSS code needed to center all the other (standard) page breaks. I need to be able to include the following CSS code for all of the rest of the page breaks:
.form-pagebreak { width: 22%; margin-left: auto; margin-right: auto;}
Originally, the first page break was ok, as long as I didn't try to center any of them.
George (gen81465)
On Saturday, July 21, 2018, 8:41:40 PM EDT, JotForm wrote:
A new response has been received: Answered by EltonCris
Use this :
#cid_80 .form-pagebreak {
width: 100%;
}
#cid_80 .form-pagebreak-next-container {
width: 100%;
text-align: center;
}
#cid_80 .form-pagebreak-back-container {
display: none;
}
Result:
View this thread on browser » Unsubscribe Thread 1532220099
... -
gen81465Replied on July 21, 2018 at 10:43 PMOops. My mistake. I didn't check out the preview of the form. It is only displaying incorrectly on the build page, which is fine with me.
George (gen81465)
On Saturday, July 21, 2018, 8:41:40 PM EDT, JotForm wrote:
A new response has been received: Answered by EltonCris
Use this :
#cid_80 .form-pagebreak {
width: 100%;
}
#cid_80 .form-pagebreak-next-container {
width: 100%;
text-align: center;
}
#cid_80 .form-pagebreak-back-container {
display: none;
}
Result:
View this thread on browser » Unsubscribe Thread 1532220099
... -
Kevin Support Team LeadReplied on July 21, 2018 at 11:49 PM
As per your last reply it seems like my colleague's code worked.
If you need further assistance, let us know.
Thanks.