I think this might be a retread of
https://www.princexml.com/forum/topic/4212/flexbox-component-not-shrinking, but I'm not sure.
The basics are a 3 column layout, and one of the columns has an image in it. The image is set to 80% width. This should be 80% of the computed flex width as far as I know. But it seems to take 80% of the page width.
I have attached a screenshot from firefox as well as the input file I used and the output I got from Prince 12.5 (by way of docraptor).
If you know of any workarounds that aren't "use latest build", let me know.
- 3erztemz-1.pdf 55.5 kB
- Screen Shot 2019-10-31 at 2.13.38 PM.png 2.2 MB
- flex-columns.html 4.2 kB
I believe this is a problem with the automatic minimum width calculation for flex items. You should be able to work around it by setting 'min-width: 0' on the relevant flex item (that is, the <div> that contains the image element). Please let us know if that doesn't work for you.
That seems to work. I'll pass it on to our customer. Thanks!
Also, is this in the list of things fixed in next major version, or on the roadmap?
The bug in the third column is fixed, and the fix will be in Prince 13. If the row container needs to fragment you may hit a couple of other issues, however.
First, we don't support 'align-self: stretch' on row items if the container height is indefinite (i.e., auto), so the middle item will not stretch to fill the container. A workaround for this is to put the entire row container inside a column container, which will make its height be definite and allow the row items to stretch.
Second, we don't always get the final height quite right, as can be seen in the first item if the above workaround is used. A workaround for this is to add a little bit of vertical space (e.g., a div with fixed height) to the end of the item contents.
We will add these last two issues to the roadmap.
Mark
Today we have released a new
latest build with support for 'align-self: stretch' for flex items in a fragmented flex row container.
