Hmmm, what you want is a vertically centered image. That's not easy to get
But if you want your ebook only for iPad (or Kindle) then you can use a method to achieve what you are seeking.
1. You need to create a .css style sheet with the following styles:
Code:
html {
height: 100%; /* very important */
margin: 0;
}
body {
height: 100%; /* very important */
margin: 0;
}
#container1 {
height: 100%;
width: 100%;
background: url("../Images/Obama.jpg") no-repeat 50% 50%; /* the image is the background of the "container" */
background-size: contain; /* this is important */
}
2. In your .xhtml file write the following:
Code:
<body>
<div id="container1"></div>
</body>
3. Finally, link the style sheet of the step #1 with the .xhtml file of step #2.
Here I attach an ePub so you can see better how the things work.
Vertical Centered Image.epub
That's all; as you can see, images are centered, vertical and horizontally. But remember that this technique will only work on iPad or Kindle; it could not work on ADE or ereaders based on ADE. However, ADE 3.0 seems to support this solution (at least, the epub I attach looks great on ADE 3.0).
Regards
Rubén