Question

CSS Centered Text Not Centered on PDF in Repository

Forms Laserfiche

Updated April 6, 2020

asked on April 13, 2018

I'm currently having an issue that I can't seem to resolve. I've got a very simple form with very simple CSS. They text input and fields are centered when the Form is active, but once it is saved into the repository my Single Line entries lose there input position and revert back to the left side of the container.

Current CSS:

/* Centers Fields and input */
.centered div.cf-field, div.cf-field input, .cf-label, .cf-address {display:inline-block; text-align:center}

What Forms looks like.

What the PDF in Repo looks like.

0 0

Answer

SELECTED ANSWER

replied on April 13, 2018

For those that may find their way to this post I was able to resolve the issue. Though I was calling the field input and the label, I also needed to add .cf-large which is the class for the Single Line value. Once I added this, the Single Line inputs were centered on the PDF stored in the Repo.

Before:

.centered .cf-field, .cf-field input, .cf-label, .cf-address {display:inline-block; text-align:center}

After:

.centered .cf-field, .cf-field input, .cf-label, .cf-address, .cf-large {display:inline-block; text-align:center}

1 0

Replies

replied on April 13, 2018

Please file a support case so we can get a sample PDF to test.

0 0

replied on August 2, 2018

We recently came across this issue too where the fields are centered in Forms but once they are saved into the Repository they are shifted left slightly.

We found that the label width property in Form Settings had an impact on the output TIF.

Viewing in Laserfiche Forms:

Viewing in Repository with Label width = Medium:

Viewing in Repository with Label width = Small:

Here is our CSS code/ Layout:

.centered .cf-field, 
.centered .cf-field input, 
.centered .cf-label,
.centered .cf-small,
.centered .cf-medium,
.centered .cf-large,
.centered .cf-xlarge
{
  	display: inline-block;
  	text-align: center;
}

.centered .cf-table th {
	text-align: center !important;
}

Hope this helps but is there a way to center regardless of the label size?

Cheers,
Dom

0 0

replied on August 2, 2018

I was actually able to get around this by using CSS

.centered #Field43.ro {
display: inline-block;
text-align: center;
}

adding the .ro after the identifier seems to have assigned the css to the text in the repository. If I'm not mistaken this only worked when I called the field using the '#' however I was able to get the results I was looking for using this.

0 0

replied on April 6, 2020

I have been playing around with this and i only want 1 field to be centered. everything else to stay aligned left. it seems SUPER simple to me but every time I enter .centered {text-align:center} it will only move the field label and not the actual input.

When i put .centered .cf-field, .cf-field input, .cf-label, .cf-address, .cf-large {display:inline-block; text-align:center} that gave me the results I wanted on my 1 field but of course skewed my other fields I didn't want moved because .cf

I know I'm missing something simple. How can I have both the header and input on only 1 field?

Current:

0 0

You are not allowed to follow up in this post.

Question

Question

CSS Centered Text Not Centered on PDF in Repository

Answer

Replies

Sign in to reply to this post.