Hi,
I create dynamically unsorted list (ul-li). It is bigger than space in a page. I would like to break the list, but it is (whole list) moved to next age. I tried set <ul style="page-break-inside: never">, but no effect
(Designer 2022.2 & 2019.2)
hope someone else will provide a better answer, but one workaround would be creating a unordered list per element with style margin:0. That way it looks like a single list, but it should break after each value.
Thanks for reply. I found out that <ul>-<li> doesn’t divide through pages only if it start from 1st page (then all ul-il is moved to 2nd page) and is bigger than space in 1st page. When I simulate starting ul-il from 2nd page, it is devided. 1st page I have configured in ‘Master Pages’ with Header: 11cm.
Moreover, if I add dynamic tables (in source code like below), even if ul-li fit to 1st page it is also moved to 2nd page. I don’t know why
<ul class="lista">
<li id="liFIRMA">odnośnik dla Firma</li>
<li id="liLTE">odnośnik dla LTE</li>
</ul>
<div id="tabelaFirma"> //before this will be inserted dynamic table from js script
</div>
<div id="tabelaLte"> //before this will be inserted dynamic table from js script
</div>
Something to keep in mind is that widows/orphans is set to 2 by default, which means a list with 2 items is never split up. If you want a list with 2 items to be broken across pages (with one list item on one page, and the other list item on the next) you’ll need to set widows/orphans for the list to 1.
It seems to be caused by the tabFIRMA script. See the marked lines in the image below. It baiscally inserts a list at an invalid location (within the structure of the table). Commenting these lines seems to fix the problem.
The reason for this is because a table will be spread over multiple pages on table rows and not on the contents of table rows, as @Sander mentioned, and I quote:
Just to be clear, a list in a table cell is perfectly valid HTML. The list items will just not be split across pages
I would like to have ul-li on the 1st page and table started on the 1st page and continued on the 2nd page (my example shows that first table row could be on 1st page (there is sufficient space) and the last row would be on the last page).
Is it possible?
Eventually ul-li could be on 1st page and table could be on 2st page.
Now 1st page is empty, and ul-li + table are moved to 2st page
Best regards,
Sławek
Probably last question in my case:
disable tabLTE, so I have ul list and dynamic table:
why, when on the 1st page there is no space for one table-row, both ul and the table are moved to 2nd page, instead only the table?
Looked at the template a bit more, it feels like a bug in our pagination algoritm where it trickles over list items in cells of dynamic tables (following @Sander 's comment). As a workaround you could use paragraphs instead and use CSS to style them as list items.
Try the following:
Open your tabFirma and replace the line where you insert the values from kol2 with the snippet below:
let kol2 = record.tables.tabFIRMA[0].tables.wiersz[tab].fields.kol2 let kol2paragaphs = kol2.replace(/<LI>(.*?)<\/LI>/ig, '<p class="list">$1</p>'); wiersz = wiersz.replace('@kol2@', kol2paragaphs );
This replaces the <LI> elements in your data with paragraphs. I’ve added a class (.list) so you can style them as list items using the following CSS (add to your .css files):
I’ve made your advice Erik (thanks) - <p> inside <td> - this works the same like ul-li.
Problem is elsewhere: when I have ul-il at the top of my html structure and only one table tabFirma enabled, it’s all right: top ul-li is on 1st page and table starts on 1st page and is continued on 2nd page (the same with <p> or ‘
’ inside <td>. Moreover, testing with short text <p> or <li> and two tables tbFirma and tabLte enabled doesn’t cause moving top ul to 2nd page.
The most important to me is to avoid moving top ul-li from 1st page to 2nd page nevermind what is below the unsorted list.
Also check your Sheet Configuration setttings. I noticed your “First Sheet” accepts only content on the back/reverse side. This forces content to the reverside when content is longer than a single page.