some basic questions about width/height/size

[angharad09]

If anyone can help out with one or more of the following questions, I'd be grateful. I've been trying to read up on them for a couple of days and am still not quite getting it.

(1a)
When width and height are given as %s, what are they a % of?
The viewing screen?
Some absolute value set higher up in the hierarchy?
The size of the image in pixels (if it's an image)?
Something else?
(1b)
Do % values affect images and text blocks the same way?

(2)
I know it's important to get image size right for quality+size reasons, but does image size also affect height/width %s in any way?

(3)
Are any of the answers different for epub vs azw3/mobi?

Many thanks.

[DNSB]

Originally Posted by angharad09

If anyone can help out with one or more of the following questions, I'd be grateful. I've been trying to read up on them for a couple of days and am still not quite getting it.

(1a)
When width and height are given as %s, what are they a % of?
The viewing screen?
Some absolute value set higher up in the hierarchy?
The size of the image in pixels (if it's an image)?
Something else?
(1b)
Do % values affect images and text blocks the same way?

A % of the block the image is being displayed in. And yes.

Originally Posted by angharad09

(2)
I know it's important to get image size right for quality+size reasons, but does image size also affect height/width %s in any way?

The image should be scaled to fit unless you have a ridiculously large image.

Originally Posted by angharad09

(3)
Are any of the answers different for epub vs azw3/mobi?

Think of it as epub/azw3 vs. mobi. The image handling in mobi's is a PITA. Images are specified in pixels. Media queries become your best friend. You'll find quite a few books especially those generated with Vellum that have pairs of code for images for azw3/mobi to make life a bit easier.

<a class="link-contains-image" href="http://www.testrina.com"><img src="../Images/image00741.jpeg" alt="Testrina Publishing" class="title-page-publisher-logo-image high-res" data-AmznRemoved="mobi7"/>

<img alt="Testrina Publishing" class="title-page-publisher-logo-image low-res" src="../Images/image00162.jpeg" width="172" height="75" data-AmznRemoved-M8="true"/></a>

<div class="ornamental-break ornamental-break-as-image" data-AmznRemoved="mobi7"><img src="../Images/svgimg0091.svg" alt="" class="inline-ornamental-break"/></div>

<p class="ornamental-break ornamental-break-as-text" data-AmznRemoved-M8="true">* * *</p>