I'm trying to use a very narrow table (3 columns) with a caption and I have nothing but trouble. Either the epub I'm building to be processed by Kindle Previewer 3.33 doesn't look the way it should (1st screenshot), or it does but then I have to make do without the pretty green checkmark next to "Enhanced Typesetting" (2nd screenshot).
Quote:
<table>
<caption>Short Caption String</caption>
<thead>
<tr>
<th>Amount</th>
<th>Unit</th>
<th>Item</th>
</tr>
</thead>
<tbody>
<tr>
<td>20.0000</td>
<td>Gram</td>
<td>Sugar</td>
</tr>
<tr>
<td>1.0000</td>
<td></td>
<td>Carrot</td>
</tr>
<tr>
<td>0.5000</td>
<td>litre</td>
<td>Cider</td>
</tr>
</tbody>
</table>
|
If I remove the caption from the table and use a span (or DIV or whatever) beneath the table, wrapping both in a DIV for the simulated caption to theoretically have the same width as the table and to share the same left margin as the centered table I get Enhanced Typesetting in the previewer 3.33 but it looks anything but enhanced: the simulated caption moves to the left margin of the page, no matter what I use (display:inline-block or block). When I add a border around the DIV containing table and caption I see that the table occupies only a fraction of the width of the page -- even on narrow screens such as an old ipod. Despite this the caption string at the bottom of the wrapping DIV is positioned outside the actual DIV.
Anyone knows how to have the caption positioned as in the 2nd image but _with_ Enhanced Typesetting on? I'd really appreciate it.
Klaus
Edit: How do you indent code when posting here? The code I fed into the form has indentation, but when I look at the posted page it's gone?