MobileRead Forums - View Single Post - Odd behavior CSS "content" property in kobo devices

DrChiper · 07-17-2023, 05:01 AM

Well, I did some investigations and found that of my 20K+ books just about 30 did use the content property, and most of them in the form of:

Code:

.something::after {
  content: " ";
 . . .
}

so you would not see it anyway.

My technical library however made intensive usage of that construct, like:

Code:

section[data-type="titlepage"]:after {
  content: url(../Images/ebook.png);
  position: absolute;
  bottom: 0;
  max-width: 100%;
}

Placing such a book on my kobo did reveal that the picture did show up on my PC (within calibre), but not on the kobo (=empty space).
Therefore my preliminary conclusion is that kobo ignores the content property. The ::after (and ::before) pseudo-element(s) do work however.

To be complete: the used ebooks were epubs, not kepub.

07-17-2023, 05:01 AM	#3
DrChiper Bookish Posts: 1,030 Karma: 2003162 Join Date: Jun 2011 Device: PC, t1, t2, t3, Clara BW, Clara HD, Libra 2, Libra Color, Nxtpaper 11	Well, I did some investigations and found that of my 20K+ books just about 30 did use the content property, and most of them in the form of: Code: .something::after { content: " "; . . . } so you would not see it anyway. My technical library however made intensive usage of that construct, like: Code: section[data-type="titlepage"]:after { content: url(../Images/ebook.png); position: absolute; bottom: 0; max-width: 100%; } Placing such a book on my kobo did reveal that the picture did show up on my PC (within calibre), but not on the kobo (=empty space). Therefore my preliminary conclusion is that kobo ignores the content property. The ::after (and ::before) pseudo-element(s) do work however. To be complete: the used ebooks were epubs, not kepub. Last edited by DrChiper; 07-17-2023 at 05:06 AM.