geometer / FBReaderJ

Official FBReaderJ project repository
http://www.fbreader.org/FBReaderJ/
1.83k stars 801 forks source link

Inconsistent alignment and bolding of <figcaption> #434

Open markstos opened 7 years ago

markstos commented 7 years ago

I was wondering why my images were displaying differently from each other on FBReader on Android, so I checked the source XHTML of my epub file to see if the source code was inconsistent or the FBReader display of the source was inconsistent. It appears the rendering is inconsistent. The different treatments I see include:

  1. showing the caption to the right of the image in bold
  2. showing the caption to the left of the image in bold
  3. showing the caption below the image, in regular text, left aligned it seems
  4. showing the caption below the image, in smaller bolder text, centered

The third one seems correct. The others do not.

Here's the CSS affecting the images from stylesheet.css:

figure.image {
  width: 100%;
  text-align: center;
}

figure.image img {
  display: inline-block;
}

figure.image figcaption {
  text-align: center;
  margin: 0em !important;
  padding: 0em !important;
  text-indent: 0em !important;
  page-break-before: avoid;
}

And here's 3 snippets which get treated differently, corresponding to the cases above:

<figure class="image center">
  <img src="images/rainy-rising-sun.jpg" alt="rainy day for a century ride" />
  <figcaption>rainy day for a century ride</figcaption>
</figure>

<figure class="image center">
  <img src="images/2015-10-17-city-bike-piccolo-smile.jpg" alt="." />
  <figcaption>the previous fall we hadn’t purchased her a touring bike yet and were still using a city bike</figcaption>
</figure>

<figure class="image center">
  <img src="images/2015-10-17-three-family-bikes-and-outhouse.jpg" alt="camping spot" />
  <figcaption>camping spot</figcaption>
</figure>

It seems the different aspect ratios of the photos may be triggering different formatting results in FBreader. Square-ish photos are more likely to get the correct caption formatting, while wider are taller photos are more likely to appear with a caption to the right or left instead of below.

For another comparison, I opened the same .epub file on Ubuntu Linux, using both fbreader and calibre for Ubuntu. calibre displayed all the captions correctly (small, centered, bold), while fbreader for Ubuntu Linux also showed a variety of inconsistent and mostly wrong caption formats.

The version of FBReader I tested on Ubuntu was '0.12.10dfsg2-1 '