需要は無いと思いますが・・。

body{
    background-image:url(img/body_bg.gif);
    margin:0px;
    padding:0px;
}
/*今回は600*400のBOXを画面中央に配置*/
div#main{
    background-image:url(img/main_bg.jpg);
    overflow:auto;
    height:400px;
    width:600px;
    position:absolute;
    top:50%;
    left:50%;
    margin-top:-200px;
    margin-left:-300px;
}



あんまり使わないと思うけど。

position:absolute;
top:50%;
left:50%;
この３行で、#mainの左上を画面ど真ん中へ。

margin-top:-200px;
margin-left:-300px;
この2行で、600*400のBOXの半分ずつをマイナスして、
#mainの真ん中を画面の真ん中へ