44
Views
2
Comments
Solved
[Ultimate PDF] Allow container resizing
ultimate-pdf
Reactive icon
Forge component by Leonardo Fernandes
Application Type
Reactive
Service Studio Version
11.54.21 (Build 62708)

Hi,

I am trying to resize containers inside other container and receiving a notice about "Use adaptive column layouts from OutSystems UI or flex layouts, and avoid using resized containers, to ensure correct pagination". 

Can this be removed?

Thanks,

Glenn


adaptive column.jpg
Solution

Hi Glenn. This is just a warning that will not be present at your final PDF.

The warning is quite helpful. If you resize your container using this method, it will use display: inline-block, and content inside inline-block may not be properly paginated by the browser. Namely, if the inline-block container is broken between two pages, the browser may cut a line of text (or other elements such as images) in two.

In your example, if the employee name happens to be positioned exactly at a page's bottom edge, the browser may break the name and print some pixels on page 1 and other pixels on page 2.

This is more relevant for column layouts that use inline-block, since the column layouts can easily span multiple pages. But it could also happen with small containers such as the one you've shown.


A workaround, as the warning mentions, is to use display-flex in the parent container, and then use flex1/flex2/flex3 classes on each children according to the proportions that each should take.

If your layout is simpler, for example 2 columns of equal width, then you can just use Columns2 block from OutSystems UI.

Hi Leonardo,

Thanks for the reply and explanation. I'll follow your instructions.

Thanks,

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.