Some css are automatically removed by Editor

nqk · 07-19-2020, 12:34 AM

Dear Kovid,

The Editor seems to remove all css items related to :root

Let's say I have this:

Code:

:root {
  --margin-top: 0.5em;
  --magin-bottom: 8em;
}

div.x {
 margin-top: var(--margin-top);
}

div.y {
  margin-bottom: var(--margin-bottom);
}

they are all removed upon Editor opening the epub.

kovidgoyal · 07-19-2020, 01:34 AM

works fine for me, you probably have the auto beatify setting enabled. :root is not supported by the library used for beautification.

nqk · 07-19-2020, 02:44 AM

Ah, I didn't know that. Thanks.

nqk · 07-20-2020, 12:49 AM

Dear Kovid,

I think the Editor supports :root but not the viewer (?). Please see the attachment when you have a moment. There are two issues there, (i) :root and (ii) border-image. I don't know why the viewer doesn't show the svg border image in the second file, while Editor does.

kovidgoyal · 07-20-2020, 01:16 AM

Switch the viewer to flow mode, it might work there, but it is never going to work in paged mode. And why are you using :root anyway, it's a synnym for html anyway.

nqk · 07-20-2020, 02:13 AM

Quote:

Originally Posted by kovidgoyal

Switch the viewer to flow mode, it might work there, but it is never going to work in paged mode. And why are you using :root anyway, it's a synnym for html anyway.

In certain ebooks there are several "color, background-color" values, nothing fancy, just various shades, :root helps to control them better. Anyway, the :root is respected in User Styles.

How about the svg border-image? I wonder why the second page doesn't show it while the first with no problem.

kovidgoyal · 07-20-2020, 02:32 AM

Because paged mode splits up the view using CSS columns, applying anything to the entire document is meaningless in paged mode.

07-19-2020, 12:34 AM	#1
nqk Fanatic Posts: 569 Karma: 32228 Join Date: Feb 2012 Device: Onyx Boox Leaf	Some css are automatically removed by Editor Dear Kovid, The Editor seems to remove all css items related to :root Let's say I have this: Code: :root { --margin-top: 0.5em; --magin-bottom: 8em; } div.x { margin-top: var(--margin-top); } div.y { margin-bottom: var(--margin-bottom); } they are all removed upon Editor opening the epub.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Editor shuts down automatically	mathil	Editor	26	02-19-2020 06:20 PM
a-z css editor solution	rjwse@aol.com	Editor	4	04-07-2018 02:09 PM
Kobo Aura H20 bottom space not removed via css.	masterz87	Kobo Reader	18	01-22-2017 11:47 AM
[old thread] non breaking spaces (* and  ) automatically removed	artoros	Sigil	31	09-04-2014 07:23 PM
Tweak epub and Simple CSS Editor	Shadowman123	Calibre	11	09-30-2010 11:07 AM

07-19-2020, 01:34 AM	#2
kovidgoyal creator of calibre Posts: 45,610 Karma: 28549044 Join Date: Oct 2006 Location: Mumbai, India Device: Various	works fine for me, you probably have the auto beatify setting enabled. :root is not supported by the library used for beautification.

07-19-2020, 02:44 AM	#3
nqk Fanatic Posts: 569 Karma: 32228 Join Date: Feb 2012 Device: Onyx Boox Leaf	Ah, I didn't know that. Thanks.

07-20-2020, 01:16 AM	#5
kovidgoyal creator of calibre Posts: 45,610 Karma: 28549044 Join Date: Oct 2006 Location: Mumbai, India Device: Various	Switch the viewer to flow mode, it might work there, but it is never going to work in paged mode. And why are you using :root anyway, it's a synnym for html anyway.

07-20-2020, 02:32 AM	#7
kovidgoyal creator of calibre Posts: 45,610 Karma: 28549044 Join Date: Oct 2006 Location: Mumbai, India Device: Various	Because paged mode splits up the view using CSS columns, applying anything to the entire document is meaningless in paged mode.

Advert

Advert