You are viewing limited content. For full access, please sign in.

Question

Question

Align fields on saved PDF copy in classic designer

asked on September 19, 2024 Show version history

G'day,

I'm working on a form in our 10.4 classic designer that needs to be released ASAP before our planned upgrade to LF11 and then onto 12. This form includes a recreation of a government department form that needs to be recreated 1:1. I'm able to get it to align correctly when the form is being filled out:

 

However when this form saves to the repository as PDF, it looks like this:

The CSS to achieve the two columns on the form is:
 

{
	float: left;
    width: 48%;
    box-sizing: border-box;
    min-height: 20px;
}

{
	float: right;
    width: 48%;
    box-sizing: border-box;
    min-height: 20px;
}

Would anyone happen to have a fix or more effective way to do this in LF10.4? I'm aware that the modern designer is way more user friendly for aligning things, but as mentioned this form is planned for release before our upgrade.

Things I've tried that didn't work:

- Placeholder text JS for fields

- .TwoPerline (this doesn't work as the fields won't always align in a row-like format)

- display: grid/inline/flex;

- Rewriting the saving version as HTML. Due to the bug with using a date variable in HTML in 10.4, this would always return as MM/DD/YYYY, which is against the specified date format

 

Any advice would be appreciated

 

Thank you

 

 

0 0

Answer

SELECTED ANSWER
replied on September 20, 2024

Haven't tried this myself since I don't use the classic designer anymore, but I'd suggest looking into a CSS flexbox with two columns. Here's a guide that should get you started: Flex Two Columns: Ridiculously easy row and column layouts with Flexbox - DEV Community.

2 0
replied on September 22, 2024

Wow... wow

I completely forgot flexbox existed. Never had a real need for it until now. I also never thought about how sections in LF worked so it's good to know it creates the <div> around the fields. 

The link you provided was a massive help and I was able to get it working. Thank you Kevin!

1 0

Replies

replied on September 19, 2024

test

1 0
You are not allowed to follow up in this post.

Sign in to reply to this post.