dvschultz / 99problems

99 Problems and e-reader rendering are all of them
60 stars 3 forks source link

iBooks Desktop returns incorrect min-width media query #36

Open dvschultz opened 9 years ago

dvschultz commented 9 years ago

it looks like iBooks for Mavericks will always return true when using min-widths:

@media only screen and (min-width: 1025px) {
    p {
        color: blue !important;
    }
}

that will turn all of a page’s text blue even when the application is very narrow.

screenshot 2014-08-07 16 40 02

teytag commented 9 years ago

Hi, Yes... The CSS3 Media Rules not works correct at iBooks Desktop... But it works at iPad or iPhone. You can download that test epubs for this topic: LABOOK http://teyid.org/testet/lib/?te=08032014 DEVICE POSITION DETECT WITH CSS3 MEDIA RULE http://teyid.org/testet/lib/?te=10032014 DEVICE POSITION JS DETECT (Primarly iPad) http://teyid.org/testet/lib/?te=11032014 screen shot 2014-08-09 at 10 18 52 am screen shot 2014-08-09 at 10 10 28 am screen shot 2014-08-09 at 10 10 01 am screen shot 2014-08-09 at 10 08 49 am screen shot 2014-08-09 at 10 08 06 am

JayPanoz commented 8 years ago

So after extended testing, it's just that the viewport in iBooks OS X is the dimensions of the document e.g. 23,000-px width—and yeah, if you're checking via JS, set a timeout or track changes because, like Readium, iBooks is a liar @ document ready and window load.