View Single Post
Old 02-23-2011, 07:20 AM   #127
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: 5,978
Karma: 4346919
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
You have to specify a fixed width to the <div> enclosing both the image and caption. Sadly, there's no way (that I know of) of passing the image's natural width to the <div>, but you can have something like:

Code:
<div class="illustration" id="ill-1">
<img src="image-01.jpg" alt=""/>
<p class="caption">Caption.</p>
</p>
with:

Code:
div.illustration { float: left; margin: 1em; }
div#ill-1 { width: 20% } /* or 240 px, or 10em, or whatever */
div.illustration img { max-width: 100% }
p.caption { ... }
It's not perfect, but it might help.
Jellby is online now   Reply With Quote