[openlp-dev] Need some HTML/CSS assistance for chord print support

[Tomas Groth]

Hi all,

As some of you might know I have been working on chord support for OpenLP,
and most of it has been implemented and will (hopefully) soon be merged
into trunk. But there is still one thing missing: Support for printing
chords. The challenge is that we have implemented chord supports using CSS,
but the component we use for printing only supports a limited subset of
CSS, and the things we need for chords to be rendered correctly is not
supported.
So I have tried to implement chords using tables, but my HTML/CSS skills
are not good enough to crack this nut, so I hope some of you can help me!

Here is an example of chords using CSS, which works fine:
https://jsfiddle.net/rm3vg5m7/1/

And here is the same chords using tables, which needs some work:
https://jsfiddle.net/3mbuxquv/1/
Feel free to fork this last one and come up with a solution where the line
wraps correctly, the trick is that you must only use the HTML element and
CSS properties mentioned on this page:
https://doc.qt.io/qt-5/richtext-html-subset.html

Best regards,
Tomas
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openlp.io/pipermail/openlp-dev/attachments/20161227/15774efd/attachment.html>