I almost forgot about this post. Got some great info out of these posts so let me update my issue with queries.
In the OP, you can see I assigned a Media string in the <style> section for amzn-mobi.
Everything is fine when I finish and preview in Kindle Previewer EXCEPT:
- EPUB doesnt work as an EPUB any longer
In other words, Most of the CSS is broken on the Nook or Aldiko or ADE, etc.
UPDATE: What I did at first was remove all @media jargon for epub version but it really bothered me that this wasnt working as everyone says it should.
Now I havent tried using @import (mainly cuz I dont fully understand it YET! Im a rookie, remember!?) but what I did do that worked was I simply removed the media="amzn-mobi" from the <style> tags in every sheet and simply put (example CSS) on a seperate style sheet:
Code:
@media amzn-mobi{
p {
text-align:left;
margin-top: 5px;
margin-bottom:5px;
}
}
Basically, I've set my EPUB to display properly with no Media Queries on most epub readers, then I copy and paiste all the CSS to be modified to the other style sheet and reset the variables to old mobi.
Everything validates and works on all my machines as both epub and mobi. My end result is a validated EPUB that can be converted to mobi easily.