Vertical Centering Images Between Anchors

Site: http://nadamt.zxq.net/panel/ver5/index.php
(Only tested in Firefox 3.5)

I am in the early stages of building a web application for comics artist and storyboard artist. I want each panel and its navigation menu to be exactly in the center of the screen (horizontally and vertically centered). I could handily do this myself if I had one image per page but I don't. I have ten images per page (as shown here: http://nadamt.zxq.net/panel/ver1/index.php) and I am using anchor links to travel between them. Problem is that I am not clever enough to figure out how to vertically center each panel/navigation menu.

Any help with this matter would be greatly appreciated. CSS is attached below, but the most relevant bit is as follows:

/****************************************** Panel Wrap */
/* Each Panel Wrap contains one panel and one navigation table. */
div.panelWrap {
width: 800px;
height: 483px;
margin: 0px auto 1000px auto; }


Thanks in advance.

Center a div
http://www.wpdfd.com/editorial/thebox/deadcentre4.html

Well, first off, that's for replying.

I already know how to center a div. The problem is that I have multiple divs that I want to center.

Hello nadamt,
Try wrapping all that in a div with overflow:hidden; You can center that div then. I just grabbed the body so I wouldn't have to edit your markup...
have a look at this -html {
background-color: rgb(15,15,15);
overflow: hidden;
margin: 0;
padding: 0; }
body {
width: 800px;
height: 523px;
margin: 200px auto;
overflow: hidden;
}
/****************************************** Panel Wrap */
/* Each Panel Wrap contains one panel and one navigation table. */
div.panelWrap {

I know, I know, it's not vertically centered. But it gives you something you can vertically center.

Thanks a million, excavator. I can now move on developing this application without having to guess the end user's screen resolution.