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

Go Back   MobileRead Forums > E-Book Software > KOReader

Notices

Reply
 
Thread Tools Search this Thread
Old 03-29-2021, 07:03 AM   #1
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 62,706
Karma: 102396822
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, PRS-650, PRS-T1, nook STR, iPad 4, iPhone SE 2020, PW3
Image height

I have some full screen images that I want to be displayed at 90% height so the caption can go at the bottom on the images. What's the best way to do this in KOReader? I'm using the February 2021 stable build. Thanks.
JSWolf is offline   Reply With Quote
Old 03-29-2021, 09:32 AM   #2
Frenzie
Wizard
Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.
 
Posts: 1,205
Karma: 448558
Join Date: Oct 2014
Location: Antwerp
Device: Kobo Aura H2O
Generally something like (max-)height: 90% or 90vh.

Edit: for example:
Code:
img {
 width: auto;
 height: 90vh;
}
Frenzie is offline   Reply With Quote
Advert
Old 03-29-2021, 09:41 AM   #3
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 62,706
Karma: 102396822
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, PRS-650, PRS-T1, nook STR, iPad 4, iPhone SE 2020, PW3
Quote:
Originally Posted by Frenzie View Post
Generally something like (max-)height: 90% or 90vh.

Edit: for example:
Code:
img {
 width: auto;
 height: 90vh;
}
I did try that with 90% as it's an ePub2. I'll give 90vh a go.

Last edited by JSWolf; 03-29-2021 at 09:46 AM.
JSWolf is offline   Reply With Quote
Old 03-29-2021, 10:46 AM   #4
Jellby
frumious Bandersnatch
Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.
 
Jellby's Avatar
 
Posts: 7,330
Karma: 14700001
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Does KOReader support "display: grid"? If so, one could try something like this (works nicely on Firefox):

Code:
@supports (display: grid) {
  .illustration {
    display: grid;
    grid-template: "image" minmax(0,max-content) "caption" min-content;
    height: 100vh;
    width: 100%;
    margin: 0 auto;
  }
  .illustration .image {
    grid-area: image;
  }
  .illustration .caption {
    grid-area: caption;
    font-size: 80%;
    padding-top: 0.5em;
  }
}
Code:
<div class="illustration">
<span class="image"><span><img src="image.jpg" alt=""/></span></span>
<span class="caption">Blah blah blah</span>
</div>
(I'm not sure the <span> inside <span class="image"> is needed, but I must have it for a reason.)

The idea is that it should work with multi-line captions too, and the whole image+caption should take 100%.
Jellby is offline   Reply With Quote
Old 03-29-2021, 12:52 PM   #5
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 62,706
Karma: 102396822
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, PRS-650, PRS-T1, nook STR, iPad 4, iPhone SE 2020, PW3
Quote:
Originally Posted by Jellby View Post
Does KOReader support "display: grid"? If so, one could try something like this (works nicely on Firefox):

Code:
@supports (display: grid) {
  .illustration {
    display: grid;
    grid-template: "image" minmax(0,max-content) "caption" min-content;
    height: 100vh;
    width: 100%;
    margin: 0 auto;
  }
  .illustration .image {
    grid-area: image;
  }
  .illustration .caption {
    grid-area: caption;
    font-size: 80%;
    padding-top: 0.5em;
  }
}
Code:
<div class="illustration">
<span class="image"><span><img src="image.jpg" alt=""/></span></span>
<span class="caption">Blah blah blah</span>
</div>
(I'm not sure the <span> inside <span class="image"> is needed, but I must have it for a reason.)

The idea is that it should work with multi-line captions too, and the whole image+caption should take 100%.
The code does not work in Sigil or KOReader. The solution was given in the post before yours.
JSWolf is offline   Reply With Quote
Advert
Old 03-29-2021, 12:52 PM   #6
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 62,706
Karma: 102396822
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, PRS-650, PRS-T1, nook STR, iPad 4, iPhone SE 2020, PW3
Quote:
Originally Posted by Frenzie View Post
Generally something like (max-)height: 90% or 90vh.

Edit: for example:
Code:
img {
 width: auto;
 height: 90vh;
}
Thanks. That works.
JSWolf is offline   Reply With Quote
Old 03-29-2021, 04:29 PM   #7
Frenzie
Wizard
Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.Frenzie ought to be getting tired of karma fortunes by now.
 
Posts: 1,205
Karma: 448558
Join Date: Oct 2014
Location: Antwerp
Device: Kobo Aura H2O
Quote:
Originally Posted by Jellby View Post
Does KOReader support "display: grid"? If so, one could try something like this (works nicely on Firefox):
No, not flex either.
Frenzie 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
Have chapter title & image take up 50% of page height and resize img automatically? dibster ePub 12 12-01-2020 12:57 PM
Image resizing issues while using max-height/max-width Detroa ePub 22 08-26-2020 06:17 PM
QT5 and image height Turtle91 Sigil 23 02-21-2013 01:44 PM
Image height in div soparch ePub 5 03-29-2012 01:18 PM
What image height causes images to fill the screen? karenbryant ePub 7 01-04-2012 04:23 AM


All times are GMT -4. The time now is 01:17 AM.


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