Image styling css... what do all these properties do?

[RbnJrg]

Originally Posted by JSWolf

p {
  color: blue;
  margin-top: 0;
  margin-bottom: 0;
  widows: 1;
  orphans: 1;
  text-indent: 1.2em;
}

That works in calibre's viewer and preview to show blue text.

No, you are wrong. That's not work on Calibre Viewer; this is a screenshot of my Calibre under Archlinux:



Color is conspicuous by its absence.

Here there is the epub so anyone can do the test. But by adding "-webkit-text-fill-color: red" and "-webkit-text-fill-color: blue" colors work.

[RbnJrg]

Originally Posted by JSWolf

It doesn't actually matter what Readium does with Webkit. Webkit is not part of the ePub3 standard. So using anything Webkit is non-ePub3 compliant.

Readium is part of ePub3 standard (is part of W3C). So, if Readium works with webkit (and it does), then webkit matters.

Can you make that Alice sample without using any Webkit and just ePub3 code?

Yes, I can. In fact, the Alice Sample employs both, standard and webkit properties (standard code is for non webkit ereaders). Watch the css stylesheet of the Alice Sample.

[Falkor]

Originally Posted by RbnJrg

No, you are wrong. That's not work on Calibre Viewer; this is a screenshot of my Calibre under Archlinux:

Attachment 216310

Color is conspicuous by its absence.

Here there is the epub so anyone can do the test. But by adding "-webkit-text-fill-color: red" and "-webkit-text-fill-color: blue" colors work.

works just fine for me without adding anything:

[Falkor]

Originally Posted by PeterT

One final data point for which I'll try for images tomorrow. Adding the book to the Kobo Android app does result in the text being wrapped correctly in the L shaped image.

It would be fascinating to see this test done on a Tolino device.

Here you go, screenshots from my Shine 5

[JSWolf]

Originally Posted by RbnJrg

No, you are wrong. That's not work on Calibre Viewer; this is a screenshot of my Calibre under Archlinux:

Attachment 216310

Color is conspicuous by its absence.

Here there is the epub so anyone can do the test. But by adding "-webkit-text-fill-color: red" and "-webkit-text-fill-color: blue" colors work.

I'm going to disagree with you. It does work in calibre's viewer. I am running Windows 11. I think it's something on your end (IMHO). This is screen grab of the ePub you posted without any changes.

[RbnJrg]

Originally Posted by Falkor

works just fine for me without adding anything:

Are you working on Windows or Linux?

[JSWolf]

Originally Posted by RbnJrg

Readium is part of ePub3 standard (is part of W3C). So, if Readium works with webkit (and it does), then webkit matters.



Yes, I can. In fact, the Alice Sample employs both, standard and webkit properties (standard code is for non webkit ereaders). Watch the css stylesheet of the Alice Sample.

Can you find where in the ePub3 standard that Webkit is part of it? Thanks.

[RbnJrg]

Originally Posted by JSWolf

I'm going to disagree with you. It does work in calibre's viewer. I am running Windows 11. I think it's something on your end (IMHO). This is screen grab of the ePub you posted without any changes.

Attachment 216318

Maybe. My screenshot is from Archlinux. But if you need to use the WebKit property on Linux to make the color visible, then you have to use it even if it's not necessary on Windows. Because you don't know if the human reader will open the epub on Windows or Linux.

[Falkor]

Originally Posted by RbnJrg

Are you working on Windows or Linux?

MacOS

[JSWolf]

Originally Posted by RbnJrg

Maybe. My screenshot is from Archlinux. But if you need to use the WebKit property on Linux to make the color visible, then you have to use it even if it's not necessary on Windows. Because you don't know if the human reader will open the epub on Windows or Linux.

But it may not be a Linux issue but something with your system. I cannot see how it would work on Windows and MacOS but not Linux.

BTW, this would explain why some code (the full screen image code that I posted) works on my system but doesn't work on yours.

[RbnJrg]

Originally Posted by Falkor

Here you go, screenshots from my Shine 5

Very nice! Just I need to make a small adjustment to the L-shaped image; a typical case of a splitted image. Other images will probably also split if you increase the font size. Could you do that and check if any additional images split? It good be great if only the L-Shape image is affected.

[RbnJrg]

Originally Posted by JSWolf

Can you find where in the ePub3 standard that Webkit is part of it? Thanks.

Indirectly, through Readium.

[DiapDealer]

Originally Posted by RbnJrg

this is a screenshot of my Calibre under Archlinux:

If you install Calibre on your Arch system using pacman, you need to know that while their packaged version is generally on par (functionality-wise) with the official version, there are going to be some differences. The official Calibre uses Qt6.8.2 and Python 3.11.12, while the pacman version uses the latest Qt6.9.1 and Python 3.13.3.

Qt6.9 WebEngine (which Calibre and Sigil use for rendering) introduced many new bugs. So it's quite possible that the issue with not being able to produce colored text without using webkit css IS something on your end. I'll check on my Arch system when next I'm in its presence.

If, however, you're using the official Calibre installer, then ignore everything I said above.

EDIT: also... does Calibre provide a mechanism for overriding its reader's css by the user (like Sigil does)? Just making sure there's not something like that in play here.

[RbnJrg]

Originally Posted by DiapDealer

If you install Calibre on your Arch system using pacman, you need to know that while their packaged version is generally on par (functionality-wise) with the official version, there are going to be some differences. The official Calibre uses Qt6.8.2 and Python 3.11.12, while the pacman version uses the latest Qt6.9.1 and Python 3.13.3.

Qt6.9 WebEngine (which Calibre and Sigil use for rendering) introduced many new bugs. So it's quite possible that the issue with not being able to produce colored text without using webkit css IS something on your end. I'll check on my Arch system when next I'm in its presence.

If, however, you're using the official Calibre installer, then ignore everything I said above.

I use Calibre installed by pacman, so it uses Qt6.9.1 and Python 3.13.3. But the same behaviour was present in my Calibre since always (Calibre installed by pacman). But again, if in all others system Calibre works fine and in Archlinux -in the version installed by pacman- it doesn't, then the webkit property must be added because we don't know where and how the human reader will employ Calibre Viewer to read the epubs.

[DiapDealer]

I understand your reasoning on the webkit prefix stuff being tangentially related to epub3 via the systems its being rendered on, but I myself would not feel comfortable including it in an actual, for-distribution, epub's css. Only because my reading of the latest epub spec indicates that the only css prefix still a part of the spec is -epub. I'm not judging though. You do you.

https://www.w3.org/TR/epub-33/#sec-css-prefixed