View Single Post
Old 07-31-2015, 11:12 PM   #24
dgatwood
Curmudgeon
dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.dgatwood ought to be getting tired of karma fortunes by now.
 
dgatwood's Avatar
 
Posts: 629
Karma: 1623086
Join Date: Jan 2012
Device: iPad, iPhone, Nook Simple Touch
Note that as shown in the stylesheet linked above, !important styles that conflict with the iBooks root styles are not ignored, so long as your style has higher specificity. I actually documented a similar quirk in iBooks' stylesheets a while back, where their use of the universal selector makes life kind of miserable if you use the -webkit-font-smoothing property.

The important thing to remember is that the CSS specificity rules are critical to understanding how things will be interpreted. If you have a paragraph class called light that forces the text to be black on white and you do this:

Code:
<p class="light">Blah blah <i>foo</i> blah</p>
you will end up with foo in night colors because the universal selector will be applied to the italic tag in the absence of a rule in your own stylesheet that overrides it.

The universal selector is a nuclear weapon, and should be used very sparingly. Unfortunately, the iBooks team seems to have fallen into the same trap that the Nook team did, resulting in many of the same headaches. Fortunately, it is possible to override those universal selectors, though you'll need to use a universal descendant selector:

Code:
.light, .light *
{
background-color: #ffffff !important;
color: #000000 !important;
}
That should work. Use sparingly.

Obviously, if you want to only override something in night mode, you'd need to go one step further:

Code:
:root[__ibooks_internal_theme*="Night"] .light, :root[__ibooks_internal_theme*="Night"] .light *
{
background-color: #ffffff !important;
color: #000000 !important;
}

Last edited by dgatwood; 07-31-2015 at 11:27 PM.
dgatwood is offline   Reply With Quote