Register Guidelines E-Books Today's Posts Search

Go Back   MobileRead Forums > E-Book Formats > ePub

Notices

Reply
 
Thread Tools Search this Thread
Old 05-21-2015, 10:33 AM   #1
xmlgirl
Enthusiast
xmlgirl ought to be getting tired of karma fortunes by now.xmlgirl ought to be getting tired of karma fortunes by now.xmlgirl ought to be getting tired of karma fortunes by now.xmlgirl ought to be getting tired of karma fortunes by now.xmlgirl ought to be getting tired of karma fortunes by now.xmlgirl ought to be getting tired of karma fortunes by now.xmlgirl ought to be getting tired of karma fortunes by now.xmlgirl ought to be getting tired of karma fortunes by now.xmlgirl ought to be getting tired of karma fortunes by now.xmlgirl ought to be getting tired of karma fortunes by now.xmlgirl ought to be getting tired of karma fortunes by now.
 
Posts: 29
Karma: 496864
Join Date: Mar 2012
Location: Virginia
Device: none
image caption display

In ADE the caption seems to determine the width of the DIV in which the image is placed
https://xmlgirl.tinytake.com/sf/MTY0NDczXzEwMzUyNzA

I want it do display like it does in Calibre - wrapping under the width of the image
https://xmlgirl.tinytake.com/sf/MTY0NDc1XzEwMzUyNzI


<div class="fig">
<img alt="Philippine damage.jpg" src="../Images/Philippine%20damage_fmt.jpeg" />

<p class="caption">Damage from Typoon Haiyan in the Philippines</p>
</div>

div.fig {
margin: 0 0 1em 1em;
display: table;
float: right;
page-break-inside:avoid;
}

div.fig p {
display:table-caption;
caption-side:bottom;
text-align: center;
margin-top:2px;
font-size: 0.75em;
font-family:Verdana, sans-serif;
}

Is display: table messing me up again. Is there a better way to do caption?

Thank you!
xmlgirl is offline   Reply With Quote
Old 05-21-2015, 10:24 PM   #2
Turtle91
A Hairy Wizard
Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.Turtle91 ought to be getting tired of karma fortunes by now.
 
Turtle91's Avatar
 
Posts: 3,347
Karma: 20171571
Join Date: Dec 2012
Location: Charleston, SC today
Device: iPhone 15/11/X/6/iPad 1,2,Air & Air Pro/Surface Pro/Kindle PW & Fire
I've never needed to use display table. I simply put it in a div. Something along the lines of:

Code:
<div class="fig"><img alt="" src="../Images/Philippinedmg.jpg" />Damage from Typoon Haiyan in the Philippines</div>

css:
div.fig {
margin: 1em 0 1em 1em;
float: right;
page-break-inside: avoid;
text-align: center;
font-size: 0.75em;
font-family: Verdana, sans-serif;
width: 25%;   (or whatever)
max-width: 300px   (the actual width of your img to avoid blurring when stretched)
}

div.fig img {
display: block;
margin-bottom: 2px
}
I would also try and avoid spaces in your file names...some systems barf on those.
Turtle91 is offline   Reply With Quote
Advert
Reply


Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Floating image with caption on its side roger64 ePub 4 12-04-2014 04:54 AM
keeping image and caption together whbenson ePub 0 08-20-2013 06:19 PM
Caption, distance from image GraciousMe Sigil 10 10-30-2012 11:12 AM
L shape image with caption? LostSock ePub 5 09-08-2011 07:24 PM
Center Image and Caption SamL ePub 11 08-12-2011 09:27 AM


All times are GMT -4. The time now is 05:31 PM.


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