Quote:
Originally Posted by GeoffR
Here is a recent thread on the issue: https://www.mobileread.com/forums/sho...d.php?t=265355
It all depends on how the publisher has done the css and html, in some cases you might find it easier to just resize the images themselves with tools such as ImageMagick, in other cases you can just edit the css, but in some cases there might be no option but to go through and edit each individual html tag.
If you could post an example of how a typical image is referenced from the html, along with the relevant css styles, then someone might be able to suggest the easiest way to do it.
Edit: AFAIK there is no way to do SVG just from CSS alone, you need to have a SVG wrapper for each individual image if there isn't one already. |
Sure. Thanks! I'll also check out the newer thread.
The HTML is not entirely straightforward, so I'll give a snippet of the HTML, then show how it displays.
Code:
<p class="noindent">The third axiom states that the belief assigned to any set of events is the sum of the beliefs assigned to its nonintersecting components. Because any event <i>A</i> can be written as the union of the joint events (<i>A</i> <img alt="image" src="images/And.jpg"/> <i>B</i>) and (<i>A</i> <img alt="image" src="images/And.jpg"/> <img alt="Image" src="images/arrow.jpg" style="vertical-align:2px;"/><i>B</i>), their associated probabilities are given by<a href="#fn1" id="fn1a"><sup>1</sup></a></p>
<p class="eqimage"><a id="eq0104"/><img alt="Image" src="images/eq01_04.jpg"/></p>
<p class="noindent">where <i>P</i>(<i>A</i>, <i>B</i>) is short for <i>P</i>(<i>A</i> <img alt="image" src="images/And.jpg"/> <i>B</i>).
The image for how that displays (in Calibre and in the Kobo desktop app - on the H20, it's super-tiny) is attached.
Images have different classes in the CSS file. Equations that are centered are in the class "eqimage."
However, there are also some math symbols that are inserted inline with no class as you can see in the snippet above. I can manipulate them a little using nested CSS referencing (I tried .noindent img and .indent img and it seemed to work okay on my computer, but not on the H20). And then there are figure classes as well that display okay, so I probably won't be touching them.
The CSS sheet has the following style for "eqclass":
Code:
.eqimage {margin-top:1em; margin-bottom: 1em; text-align: left; text-indent: 1.25em;}
As I said, I tried adding adding height and width here using both em and %, but it didn't actually resize the image.