[Turtle91]

Originally Posted by RbnJrg

Hi mrmikel;

Vertical centering is not so difficult as it seems. Try this code:

div#container {
   display: table;
   width: 500px;
   height: 700px;
   margin: 0 auto;
   padding: 18px;
   border: 5px solid red; /* Only to see the "table" */
}

div#content {
   display: table-cell;
   width: 100%;
   height: 100%;
   vertical-align: middle;
   font-size: 1.0em;
   text-align: left; /* for poetry */
   padding: 0 36px; /* not neccesary, just to see the text better */
   border: 5px solid black; /* Only to see the vertical align */
}

The "border" properties are not neccesary; I just included them in order that the centering it shows better. In order that the font-size doesn't affect the centering, margins and paddings (if any) must be in PIXELS.

The output is something like the following picture (from my K4NT):

https://www.mobileread.com/forums/att...9&d=1368923758

The key is to use two "divs", one as "table" and the other as a "table-cell". After that, you can use the property "vertical-align" that makes all the work

I use this technique quit a bit and it seems to work in sigil, Marvin, and Firefox epubreader...but I haven't checked ADE, Nook, or Mobi...does it work there too?