Quote:
Originally Posted by Turtle91
The technique I gave seems to work fine for me (see attached).
You didn't mention that you wanted two different placements, a top and bottom. In that case you need to make sure you delineate the different sections...I use a div on the attachment to place one section vertically centered, and the other vertical at the bottom.
Using margin:0 auto can sometimes help when centering an image.
Code:
CSS:
body {text-align:center; font-family:serif; text-indent:0; padding:0; margin:0}
h2.title {font-size:1.7em; margin-top:0; text-transform:uppercase}
.sub {font-weight:bold; font-size:1.1em; }
.pub {font-size:.8em}
.pub img {display:block; width:10%; margin:0 auto}
div.v-ctr, div.v-btm {height:100vh; width:100vw; display:table; position:fixed}
/* Vertically centered on page */
div.v-ctr div {display:table-cell; vertical-align:middle}
/* Vertically bottom of page */
div.v-btm div {display:table-cell; vertical-align:bottom}
Code:
HTML:
<body>
<div class="v-ctr">
<div>
<h2 class="title">Eddie's Boy</h2>
<p class="sub">A Novel</p>
</div>
</div>
<div class="v-btm">
<div>
<p class="pub">
<img alt="" src="../Images/logo_MysteriousPress.png"/>
The Mysterious Press<br/>New York
</p>
</div>
</div>
</body>
Attachment 210836 |
Can you do this so the code works with both ePub2 and ePub3?