Sigil CSS parser will not understand the new nested CSS

[KevinH]

Hi All,

Just a warning. Sigil's CSS Parser which is used throughout the Sigil Reports codebase and a few other places does not understand the new (2025) allowed nested css structure.

https://developer.mozilla.org/en-US/.../Nesting/Using

I would guess that is true for most epub ereaders not based on very very recent webkit/webengine browsers. So using it will limit your base for your epub.

Personally, I think the ability to nest css selectors inside each other is for the birds when it adds nothing and the first thing the downstream software generally does is flatten it back to a simple list an no one wants to process a second tree inside the html DOM tree.

So if you do attempt to write and use nested css in Sigil be prepared for it to get mangled.

Most of the younger devs never seem to have learned about the KISS principle of engineering. So sad. Or is this just my age showing ...

[JSWolf]

Originally Posted by KevinH

Most of the younger devs never seem to have learned about the KISS principle of engineering. So sad. Or is this just my age showing ...

I agree that devs these devs just don't follow the rules for KISS. Look at a lot of eBooks and you'll see that the code can be quite a mess.

As for nested CSS, I'm not for it at all.

[theducks]

Originally Posted by KevinH

Hi All,

Just a warning. Sigil's CSS Parser which is used throughout the Sigil Reports codebase and a few other places does not understand the new (2025) allowed nested css structure.

https://developer.mozilla.org/en-US/.../Nesting/Using

I would guess that is true for most epub ereaders not based on very very recent webkit/webengine browsers. So using it will limit your base for your epub.

Personally, I think the ability to nest css selectors inside each other is for the birds when it adds nothing and the first thing the downstream software generally does is flatten it back to a simple list an no one wants to process a second tree inside the html DOM tree.

So if you do attempt to write and use nested css in Sigil be prepared for it to get mangled.

Most of the younger devs never seem to have learned about the KISS principle of engineering. So sad. Or is this just my age showing ...

Or just because you can do it, that you SHOULD
I wonder if this is just another case of planned obsolescence so you MUST by a new one?

[KevinH]

Either way, I was able to use the Google AI to help write a CSSDenester.h code that will flatten nested css back to "normal" unnested css.

I have added it my personal c++ std::string cssparser repo. I will next take that code and rewrite it using Qt's QString and once tested will add it to Sigil's internal qCSSParser implemetation.

That way future versions of Sigil will produce flattened CSS when you reformat your css. That way your css is kept as viable as possible for older epub e-readers.

(In other words I was too lazy to completely rewrite our current cssparser to be tree based!).

Update:

This has now been added to Sigil master for testing.

[DNSB]

For anyone interested in testing, here's a link to my compile of the latest code from Sigil's Github repository: Sigil-2.7.6-Windows-x64-Setup.exe.

[KevinH]

Thanks! If anyone is looking for some small css testcases that use nesting, see

https://github.com/Sigil-Ebook/cssparser

And grab nesttest*.css and you can drag and drop them on Sigil.

To flatten the css back to normal simply use the reformat css multiline or single line routines.

[KevinH]

According to DNSB's testing and feedback the added de-nest css code had to be replaced even though it did de-nest truly nested css properly it could not properly handle normal un-nested css.

So I want back to the drawing board and Sigil now has completely redesigned de-nest software that passes through un-nested css unchanged.

@DNSB, Thank you!

[DNSB]

For anyone interested in testing, here's a link to my compile of the latest code with the fixed de-nest code from Sigil's Github repository: Sigil-2.7.6-Windows-x64-Setup.exe.

[JSWolf]

Is there any ePub reading software that handles nested CSS?

[KevinH]

Any ereader that uses a webkit or webengine core that was made in the last two years (2024?) probably could.

Native CSS nesting is widely supported across all modern browsers. As of late 2023, it reached "Baseline 2023" status, meaning it is available in the stable versions of all major engines: Chromium (Chrome, Edge), Gecko (Firefox), and WebKit

Though I doubt any epubs exist with nested css in the wild (yet). This is just future proofing Sigil as I am sure those who pull in html from websites to create their ebooks will eventually run into it and it can mess with finding classes or and used vs unused selectors, and deleting selectors in Sigil (before this code was added). Now with this de-nester code it should not, with the added bonus of making the css more compatible with older e-readers.

[JSWolf]

Originally Posted by KevinH

Any ereader that uses a webkit or webengine core that was made in the last two years (2024) probably does.

Though I doubt any epubs exist with nested css in the wild (yet). This is just future proofing Sigil as I am sure those who pull in html from websites to create their ebooks will eventually run into it.

I didn't think of website code that could use nested CSS. That's a good reason to support de-nesting it.

[KevinH]

My guess is native nested css would work just fine in Calibre and Sigil's Previewer right now.

[KevinH]

And if you think about it, as long as CSS and Html standards are live standards (whatwg) that continuously grow and change, the days of dedicated e-readers are either numbered or will require firmware updates quite often.

This is another reason why both Sigil and Calibre are constantly updating to the latest Qt and QtWebEngine versions.