Forum › Feature requests
CSS Shapes
We do want a mechanism for non-rectangular floats and cut-outs in the future, but it will probably need to wait until Prince 10 is finished. 
Hi!
i need to make a text float around an oval shape, like in the attached pdf.
i guess CSS Shapes is not integrated in Prince yet... i haven't seen it in the properties list.
Any idea on how to achieve that?
Thank you!
i need to make a text float around an oval shape, like in the attached pdf.
i guess CSS Shapes is not integrated in Prince yet... i haven't seen it in the properties list.
Any idea on how to achieve that?
Thank you!
Sadly this is very difficult at the moment and probably impossible for arbitrary free-flowing text. 
Hi,
We are migrating to an html-based workflow using Prince for most of our books and so far it's working great. However the lack of non-rectangular floats is a real limiting factor and for some of our artwork-heavy books simply means Prince isn't an option.
Do you have any timeline for when CSS Shapes might be implemented?
We are migrating to an html-based workflow using Prince for most of our books and so far it's working great. However the lack of non-rectangular floats is a real limiting factor and for some of our artwork-heavy books simply means Prince isn't an option.
Do you have any timeline for when CSS Shapes might be implemented?
Not at the moment, no. Some simple shapes can be made (somewhat tediously) by stacking lots of one-line floats one on top of the other, although this will not handle concave shapes.
Oh well, that's bad news, but thanks for the reply anyway.
Do you know whether Adobe's CSS Shapes polyfill works in Prince? I believe it works by creating a load of single-line floats as you say, but am unsure whether the Javascript-based way of generating them would work in Prince.
(And generally, do javascript-based polyfills of this type work in Prince? I was also wondering about one for hanging punctuation.)
Do you know whether Adobe's CSS Shapes polyfill works in Prince? I believe it works by creating a load of single-line floats as you say, but am unsure whether the Javascript-based way of generating them would work in Prince.
(And generally, do javascript-based polyfills of this type work in Prince? I was also wondering about one for hanging punctuation.)
Edited by imperator
We can try it and see. I'm guessing it won't, as it probably requires reflow, whereas Prince runs all the JavaScript before commencing layout.
Hi imperator, regarding the CSS shapes polyfill I'm afraid it contains quite a lot of code depending on DOM dimension stuff (as expected) - they create a lot of single-line SPAN with positions set to "flow" text around some element, and naturally there's lots of calculations that need string sizes and line heights. This will not work in Prince at the moment, since it runs JavaScript before doing layout and facts about element dimensions are simply not available yet.
Regarding the hanging punctuation question, did you have a specific library in mind? If you post a link I could investigate whether it works or could be made to work in Prince.
Regarding the hanging punctuation question, did you have a specific library in mind? If you post a link I could investigate whether it works or could be made to work in Prince.
(I can't tell you if such libraries generally work or not - some do and some don't..)
Not yet, no. We will probably need to revisit float collision detection before we can move onto this.