CSS: align accordion in the center of the page

问题

Today's question : how do i vertically align that *#@$¤<ç~&# accordion in the very center of my page (align it vertically & horizontally)? here's the jsFiddle

回答1:

Try:

myUl = $("ul");
myUl.css('position', 'absolute');
myUl.css('top', $(window).height() / 2 - myUl.height() / 2);  
myUl.css('left', $(window).width() / 2 - myUl.width() / 2);  

Result: http://jsfiddle.net/z6Zyj/2/.

If you want a CSS only solution, you must do something as:

ul {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -45px;
    margin-left: -295px;
}

Where 45px is approximately half the height of your accordion and 245px is half the width of it.

Result: http://jsfiddle.net/z6Zyj/3/.

回答2:

I just wrapped the whole accordion div in a 1x1 table and center aligned the table. Make the table width the same as the accordion width.

来源：https://stackoverflow.com/questions/10751266/css-align-accordion-in-the-center-of-the-page