Contents | Start | End | Previous: KB0271: How can I use Microsoft Edge to view my ebooks? | Next: KB0273: Why are my tables and boxes clipped on the right edge?


KB0272: Why are my tables not centred in an Epub viewer?

Adobe Digital Editions (ADE) and other viewers based on ADE code have a problem displaying centred tables.

In order to support centred tables in ADE, the CSS attribute "display:inline-block" must be used. However, tables with this attribute do not span multiple pages - the part of the table that isn't displayed on the first page will simply be lost. To work around this conundrum, set the configuration property Maximum table rows for inline-block to the number of rows above which you consider a table to be large and in danger of being rendered across page boundaries. The default is zero (so inline-block will not be used by default). Tables larger than this size will omit the "display:inline-block" attribute to favour correct rendering across pages over centring. Centring should work correctly on most other ereaders without the need for this attribute, since we also use "margin-left:auto;margin-right:auto" to implement centring.

Note that using inline-block can cause tables to be rendered incorrectly on some ereaders (with the overall table border becoming separated from the cells). Also, if you have the configuration option Maximum table rows for inline-block set to a non-zero value, the generated HTML table may have an extra paragraph tag around it in order to support centring on some platforms. Set the option to zero to ensure that a table that is alone in a paragraph is not enclosed within outer paragraph tags, which can cause problems in some situations, including unexpected text sizes. Also, on Kindle for iOS, making a table an inline-block appears to stop the reader from advancing to the next page, although this might be in combination with floating tables. In summary, use Maximum table rows for inline-block with extreme caution!

You might like to try selecting the table and inserting a text box around it, which is more likely to be centred by ADE. Remove the width from the table and set the box's width to a percentage width if you want it to be a proportion of the display width instead of the whole width. If you have implemented text boxes using tables, consider implementing them as pure text boxes instead.

Or, have the table expand to the full width of the display by specifying 100% width, so that centring is not an issue.

Keywords: table centred, table centered, table center, table centering


Contents | Start | End | Previous: KB0271: How can I use Microsoft Edge to view my ebooks? | Next: KB0273: Why are my tables and boxes clipped on the right edge?