Signature Field Too Large. [RESOLVED]

Get Help
, ,
1

Hi everyone,

I’ll start by saying that I don’t know a whole lot about WordPress. This issue landed on my plate after the person responsible for our website left the company. I do have some experience developing sites with C# and Node.js, but CMS systems are still pretty foreign to me.

Now, on to the issue. We have a forum on our site that looks fine for the most part. The only problem is that at the bottom of the forum we have a signature field. The width is fine, but the height expands all the way to the bottom of the page and overlaps our submit button and page footer. I’ve included a screenshot in this post.

Can anyone tell me how to reduce the size—or at least prevent it from overlapping other elements?

Thanks,
Dave

2

Any chance you have a URL you could share where the problem could be seen?

3

I actually got it working. I had to add the following CSS to fix it:

/* Prevent canvas scaling so signature lines up with the cursor */
.gfield_signature_container canvas {
    width: auto !important;
    height: 180px !important;
    max-height: 180px !important;
}
.gfield_signature_container canvas {
    transform: none !important;
}

/* Prevent flexbox or inherited height from stretching the signature field */
.ginput_container {
    height: auto !important;
    max-height: none !important;
}

.gfield_signature_container {
    width: auto !important;
    height: auto !important;
    max-width: 1000px !important;   /* adjust if you want */
    max-height: 500px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
	text-align: center;
}
1 Like