Question

Trouble with Header moving after Submission

Forms

Updated July 3, 2017

asked on June 29, 2017

Hi All,

I am currently designing a custom header for a form i am creating, by using a custom html field and CSS to move it to the correct position. Unfortunately after submission the Custom HTML field drops down and covers the title.

Here is the coding i am using :

#[ID] {position:absolute;top:0; margin-left: 09px; border-left: 09px; padding-left:09px !IMPORTANT}
.cf-formwrap {margin-top:119px}

Would anyone have any ideas how to fix the field in place so it looks the same when being reviewed?

Thanks,

Chris

0 0

Answer

SELECTED ANSWER

replied on July 2, 2017

The wkhtmltopdf is the tool used for generating PDF/TIFF. You could see it being installed on Forms installation. It's a third-party tool so we are not sure whether the bug could be fixed.

I have an alternative solution that displays the custom HTML field inside title block instead of on top of it so it does not use margin:

#q1 {position:absolute;top:0;margin-top:50px; margin-left: 09px; border-left: 09px; padding-left:09px !IMPORTANT}
@media (max-width: 768px) {#q1 {position:absolute;top:0;margin-top:0;}}
#form-title-wrap {position:absolute; top:119px}
#cf-formtitle {position:relative; height:150px}

Whens saved to repository:

Can you check if this works for you?

1 0

Replies

replied on June 29, 2017

It seems to be wkhtmltopdf bug that CSS margins have no effect: https://github.com/wkhtmltopdf/wkhtmltopdf/issues/1606

For your case, what about hide the form title and put content of the form title into the custom html? Then you could remove the CSS for margins.

0 0

replied on June 30, 2017 • Show version history

Hi Rui, unfortunately i won't be able to hide the form title as it is required by my company.

I've never heard of wkhtmltopdf before, is this bug in the process of being fixed?

Not encountered it when using forms.

Chris

0 0

SELECTED ANSWER

replied on July 2, 2017

The wkhtmltopdf is the tool used for generating PDF/TIFF. You could see it being installed on Forms installation. It's a third-party tool so we are not sure whether the bug could be fixed.

I have an alternative solution that displays the custom HTML field inside title block instead of on top of it so it does not use margin:

#q1 {position:absolute;top:0;margin-top:50px; margin-left: 09px; border-left: 09px; padding-left:09px !IMPORTANT}
@media (max-width: 768px) {#q1 {position:absolute;top:0;margin-top:0;}}
#form-title-wrap {position:absolute; top:119px}
#cf-formtitle {position:relative; height:150px}

Whens saved to repository:

Can you check if this works for you?

1 0

replied on July 3, 2017

Worked brilliantly, thank you! :)

0 0

You are not allowed to follow up in this post.

Question

Question

Trouble with Header moving after Submission

Answer

Replies

Sign in to reply to this post.