How do you center text vertically?

[44reader]

How do you center text on a page, like in the attached image?

I am a complete novice at html but I guess it would involve tags like this:

<p class="P-P5">MY CENTERED TEXT</p>

and then setting top and bottom margins in the stylesheet.

Here is an entry from my current stylesheet. Can you tell me how to adjust it to get the text centred vertically as well as horizontally please?

P-P5 {
border-bottom: 0;
border-top: 0;
display: block;
font-family: "Times New Roman", serif;
font-size: 1.83333em;
font-weight: bold;
line-height: 1.2;
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
margin-top: 0;
padding-bottom: 0;
padding-left: 0;
padding-right: 0;
padding-top: 0;
text-align: center
}

[Jellby]

There's no way to center vertically, because there's no way to access the page's height (there's no "page", actually).

However, some tricks that assume "height: 100%" means the full screen height might work is some readers (and fail in others).

[44reader]

OK, thanks, Jellby.

So it's probably best if I don't try and center my text, just drop it down from the top of the page a bit using a top margin.

Should I specify that in ems? I'm sure that's better than using fixed dimensions e.g. inches. But can you specify a margin as a percent of the page or something?

I can only play with my results on my tiny phone and calibre's reader - otherwise I wouldn't ask and just play around with it.

Thanks.

By the way, I see in one of your books you use "vertical-align: text-top". What does vertical-align do?

[theducks]

Originally Posted by 44reader

OK, thanks, Jellby.

So it's probably best if I don't try and center my text, just drop it down from the top of the page a bit using a top margin.

Should I specify that in ems? I'm sure that's better than using fixed dimensions e.g. inches. But can you specify a margin as a percent of the page or something?

I can only play with my results on my tiny phone and calibre's reader - otherwise I wouldn't ask and just play around with it.

Thanks.

By the way, I see in one of your books you use "vertical-align: text-top". What does vertical-align do?

That applies to cell contents in tables

for all attribute definitions (straight from the source) : http://www.w3.org/TR/1999/REC-html40...ttributes.html

[JSWolf]

You can use a percent like 48% to have a top margin of 48% from the top of the page. That would work for what you want.

Another thing, your CSS code looks like. It came from Word. If so, do yourself a favor and keep your book out of Word. You will save yourself a lot of grief.

[theducks]

I have been using JSWOLF's method on books for my PEz.

My current method is Trial and error to get the percentage.

Is there a calculated (forward referenced? ) way to arrive at a value?

top-margin = 50 - (.5*<the vertical size of the containing block>)%

[Jellby]

Originally Posted by 44reader

Should I specify that in ems? I'm sure that's better than using fixed dimensions e.g. inches. But can you specify a margin as a percent of the page or something?

Originally Posted by JSWolf

You can use a percent like 48% to have a top margin of 48% from the top of the page.

Yes, but according to the CSS spec, percent in margins always refers to the page width. That is, "top-margin: 48%" and "left-margin: 48%" are exactly the same size, almost half the page width. I can't say whether or not ebook readers follow the specs, though.

[44reader]

Thanks, Jellby.

If the three lines of text are slightly higher up the page than the center, that will still look good. So I'll probably just stick with 49% and even if it's 49% of the width (rather than the height) I'm sure it'll be fine.

I'm PMing you now about the whole Word issue. Then afterwards, depending on what you say, I can start or join another thread to sort myself out. PM on its way now.

[JSWolf]

Originally Posted by Jellby

Yes, but according to the CSS spec, percent in margins always refers to the page width. That is, "top-margin: 48%" and "left-margin: 48%" are exactly the same size, almost half the page width. I can't say whether or not ebook readers follow the specs, though.

But I've used and seen % in the top margin and I've seen it work the way it was intended.