Register Guidelines E-Books Search Today's Posts Mark Forums Read

Go Back   MobileRead Forums > E-Book Software > Calibre > Editor

Notices

Reply
 
Thread Tools Search this Thread
Old 09-29-2019, 01:34 AM   #1
AndrewCanada
Junior Member
AndrewCanada began at the beginning.
 
Posts: 1
Karma: 10
Join Date: Sep 2019
Device: Kindle Paperwhite
Image Alignment Issues

Good evening,

I am working on my eBook (AZW3 format) and it has a number of portrait images. I am trying to format them such that they have a height of 50% of the page, are scaled with the original aspect ratio, and are centred horizontally.

HTML:

Code:
<div class="calibre35"><img class="calibre35" src="../images/00033.jpeg"/></div>
CSS:

Code:
.calibre35 {
  height: 50%;
  text-align: center;
}
Unfortunately with this code, everything looking great in the ebook-edit program preview window but when I load the file onto my Kindle Paperwhite it's a mess. 1 image might be the correct size and centred, another might be ~80% height and centred, and others might be 50% height but 100% width (stretched horizontally). Yet all of these files are the same dimensions and use the same HTML and CSS classes.

What am I doing wrong?!
AndrewCanada is offline   Reply With Quote
Old 09-29-2019, 07:52 AM   #2
kovidgoyal
creator of calibre
kovidgoyal ought to be getting tired of karma fortunes by now.kovidgoyal ought to be getting tired of karma fortunes by now.kovidgoyal ought to be getting tired of karma fortunes by now.kovidgoyal ought to be getting tired of karma fortunes by now.kovidgoyal ought to be getting tired of karma fortunes by now.kovidgoyal ought to be getting tired of karma fortunes by now.kovidgoyal ought to be getting tired of karma fortunes by now.kovidgoyal ought to be getting tired of karma fortunes by now.kovidgoyal ought to be getting tired of karma fortunes by now.kovidgoyal ought to be getting tired of karma fortunes by now.kovidgoyal ought to be getting tired of karma fortunes by now.
 
kovidgoyal's Avatar
 
Posts: 35,513
Karma: 12737927
Join Date: Oct 2006
Location: Mumbai, India
Device: Various
Your best bet is SVG, or alternately using viewport units, though I dont recall if the Kindle renderer supports them
kovidgoyal is offline   Reply With Quote
Advert
Old 10-06-2019, 12:47 PM   #3
deback
Book E d i t o r
deback knows the complete value of PI to the enddeback knows the complete value of PI to the enddeback knows the complete value of PI to the enddeback knows the complete value of PI to the enddeback knows the complete value of PI to the enddeback knows the complete value of PI to the enddeback knows the complete value of PI to the enddeback knows the complete value of PI to the enddeback knows the complete value of PI to the enddeback knows the complete value of PI to the enddeback knows the complete value of PI to the end
 
Posts: 349
Karma: 31930
Join Date: May 2015
Device: Laptop
.calibre35 {
height: 50%;
text-align: center;
}

You can't have both of the above lines in the same class. Create another class for the text-align line.

Examples:

<div class="calibre36"><img class="calibre35" src="../images/00033.jpeg"/></div>

.calibre35 {
height: 50%;
width: 50%;
}

.calibre36 {
text-align: center;
}
deback is offline   Reply With Quote
Reply

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Hello/Image and text alignment Derek R Introduce Yourself 3 06-26-2011 11:47 AM
Image alignment and spacing Derek R Kindle Formats 5 06-25-2011 01:57 PM
PRS-650 Text and alignment issues henders254 Sony Reader 0 05-14-2011 09:11 PM


All times are GMT -4. The time now is 09:02 AM.


MobileRead.com is a privately owned, operated and funded community.