![]() |
#1 |
Zealot
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 138
Karma: 12096
Join Date: May 2010
Device: Loads!
|
Kindle Fire woes... indent and media Queries
I thought that since I'm having an easy day nursing a nasty cold that I'd have a play with my poetry CSS.
But I'm noticing some REAL wierd stuff on the Kindle Fire in the Amazon previewer. Here's some CSS for a simple three level indent from my stylesheet. I'll get to hanging indents later... Code:
p.poetry1 {text-align:left !important; text-indent: 0em !important; margin-left: 3em !important;} p.poetry2 {text-align:left !important; text-indent: 0em !important; margin-left: 4em !important;} p.poetry3 {text-align:left !important; text-indent: 0em !important; margin-left: 5em !important;} @media amzn-kf8{ p.nothing{text-align:left;} p.poetry1 {text-align:left; margin-left: 3em; color:#f00;} p.poetry2 {text-align:left; margin-left: 4em; color:#0f0;} p.poetry3 {text-align:left; margin-left: 5em; color:#00f;} } @media amzn-mobi{ p.poetry1 {text-align:left !important; text-indent:-20px;} p.poetry2 {text-align:left !important; text-indent:-40px;} p.poetry3 {text-align:left !important; text-indent:-60px;} } Two WIERD problems: 1. My KF8 poetry1 style (well, the colour) is IGNORED unless I have a sacrificial style "nothing" at the start of the block - that CAN'T be right, I must be doing something badly wrong here. 2. I really can't get indents on the Kindle previewer for Kindle Fire to work. All three paragraphs come out with the same indent. ![]() Any clues for my flu-addled brain? Andy |
![]() |
![]() |
![]() |
#2 |
Zealot
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 138
Karma: 12096
Join Date: May 2010
Device: Loads!
|
ah... okay, looks like the
@media amzn-kf8{ line was throwing things and breaking the subsequent line... (pass the lemsip) |
![]() |
![]() |
Advert | |
|
![]() |
#3 |
Grand Sorcerer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 28,555
Karma: 204127028
Join Date: Jan 2010
Device: Nexus 7, Kindle Fire HD
|
So it's working fine, now? I'm not sure I follow what was going wrong and/or what fixed it. Was there a space needed immediately following amzn-kf8 before the '{' or something?
|
![]() |
![]() |
![]() |
#4 |
Zealot
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 138
Karma: 12096
Join Date: May 2010
Device: Loads!
|
No, not working. SOMETHING wierd is happening, the first style in the block is still getting ignored. Even if I put the '{' on the next line.
Driving me crazy, because I can't see what I'm doing wrong here... |
![]() |
![]() |
![]() |
#5 |
Grand Sorcerer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 28,555
Karma: 204127028
Join Date: Jan 2010
Device: Nexus 7, Kindle Fire HD
|
Your exact code works fine for me. Even when removing the "p.nothing{text-align:left;}" line, the colors and indents appear as expected when viewing with the Kindle Previewer in Fire mode.
The amzn-mobi part doesn't appear to be working correctly for me... or rather I should say the higher-priority default settings (text-indent and margin-left) seem to be conspiring with the less prioritized negative text-indents in the amzn-mobi section to make the three lines all indented equally as much... at what appears to be three ems. |
![]() |
![]() |
Advert | |
|
![]() |
#6 |
Zealot
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 138
Karma: 12096
Join Date: May 2010
Device: Loads!
|
I've just tried swapping MobiGen for KindleGen in my toolchain and I'm now getting more promising results!
Not quite there yet, but at least thinge seem a little more under control. |
![]() |
![]() |
![]() |
#7 |
Zealot
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 138
Karma: 12096
Join Date: May 2010
Device: Loads!
|
Interesting...
It seems that if you do: @media not amzn-mobi { .poetry1 {text-align:left !important; text-indent: 0em !important; margin:0 0 0 3em; color: #ff0;} .poetry2 {text-align:left !important; text-indent: 0em !important; margin:0 0 0 4em; color: #0ff;} .poetry3 {text-align:left !important; text-indent: 0em !important; margin:0 0 0 5em; color: #f0f;} } On ADE, the first style is ignored, but on Calibre and iBooks all three styles work just fine... sigh. |
![]() |
![]() |
![]() |
#8 |
Zealot
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 138
Karma: 12096
Join Date: May 2010
Device: Loads!
|
... a good day for getting to the bottom of some old legacy problems. There was I thinking that -ve text-indents weren't supported in the new KindleGen, when I found a
Code:
text-indent:1em !important; A hangover from when I put those in to get Stanza to stop over-riding nearly all the formatting. ![]() ... ahh, the world makes more sense now. |
![]() |
![]() |
![]() |
#9 |
Grand Sorcerer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 28,555
Karma: 204127028
Join Date: Jan 2010
Device: Nexus 7, Kindle Fire HD
|
ADE has no idea what those amzn media queries are. So I doubt it knows how to even interpret not amzn-mobi. But I can't say for sure.
That's why I use the @import method and use three completely separate CSS files: one for ePub, and one each for MOBI and KF8. That way, I just comment out or delete the amzn-* lines to publish the ePub or vice-versa for building the MOBI. |
![]() |
![]() |
![]() |
#10 |
Zealot
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 138
Karma: 12096
Join Date: May 2010
Device: Loads!
|
I'd have thought that a SENSIBLE strategy would have been to ignore any media queries that aren't understood. So @media amzn-mobi or @media some-brand-new-device would just be ignored on ADE as they probably just wouldn't apply. Otherwise, how could it be future-proof?
|
![]() |
![]() |
![]() |
#11 | |
Grand Sorcerer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 28,555
Karma: 204127028
Join Date: Jan 2010
Device: Nexus 7, Kindle Fire HD
|
Quote:
Last edited by DiapDealer; 04-10-2012 at 02:44 PM. |
|
![]() |
![]() |
![]() |
#12 | |
Grand Sorcerer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 11,470
Karma: 13095790
Join Date: Aug 2007
Location: Grass Valley, CA
Device: EB 1150, EZ Reader, Literati, iPad 2 & Air 2, iPhone 7
|
Quote:
Dale |
|
![]() |
![]() |
![]() |
|
![]() |
||||
Thread | Thread Starter | Forum | Replies | Last Post |
Media Queries on Kindle Previewer | AIR-WIZZ | Kindle Developer's Corner | 26 | 10-15-2012 10:10 AM |
TWO OPF files or something like Media Queries in the OPF file for KF8 and MOBI? | DHahn | Kindle Formats | 3 | 04-17-2012 04:06 AM |
Kindle Fire:Both Wireless Mirroring And Native Streaming Media | frahse | News | 24 | 10-01-2011 07:14 PM |
Queries re Kindle | mitch13 | Amazon Kindle | 7 | 07-01-2011 01:08 AM |