# Centering a div in the window

*update* This was posted back in the dark ages of 2008.  Thankfully we can just use flexbox nowadays.

Ever wanted to center a panel in the middle of the browser window? There's a lot of code out there that claims to do this, but it isn't standards compliant and doesn't work on all browsers. But never fear, there is an easy way to do it without any browser specific hacks.

First, you need a couple of styles:

body {
background-color: #000000;
}
.reference {
background-color: transparent;
position: absolute;
top: 50%;left: 50%;
width: 1px;height: 1px;
}
#panel {
position:absolute;
left:-485px;top:-256px; width:970px;height:512px;
background-color:#FFFFFF;
}


Now the html:

<div class="reference">
<div id="panel">