Vertical Centering

[customdavid]

I am trying to center my welcome splash screen page both vertically and horizontally on the screen. I have a single image on the screen with a click here message. The master border margins are 0 all the way around.

Searching the forum I found the code below from last year that really worked great, but it displays the following above my image:

style="margin: 0px;">

I tried even making sure that the master border had something in the margin and it still shows that way. I also tried adding this only to the HTML for the master border, only the page layout html and both combined, regardless I get the message above. What am I doing wrong and how do I fix it?

Any help would be appreciated,

Thanks,

David



Code used to display screen vertically:

In the Head tag place the following
<style>
<!--
html,body {
margin: 0;
padding: 0;
}
div {
-moz-box-sizing: border-box;
box-sizing: border-box;
}
div#test {
height: 100%;
valign: middle
align: center
}
-->
</style>


Next
Place the following beginning of body tag

<div ID="test">
<table height="100%" width="100%">
<tr><td valign="middle" align="center">


Next
Place the following end of body tag

</td></tr></table></div>

[barbara0701]

Hello David,

you can use the following code for absolute centering (vertical and horizontal) in HTML (not XHTML - for XHTML you need a different code):

Body beginning:

<table border=0 cellspacing=0 cellpadding=0 width="100%" height="100%">
<tr valign=middle align=center>
<td valign=middle align=center>

Body end:

</td></tr></table>

Make sure all pages have exactly the same size.

[customdavid]

Perfect! That is exactly what I was looking for. I only have this on my opening page, using a custom master border, so it does not impact the rest of my site.

Thanks so much for the very quick response,

David

[barbara0701]

You're welcome