เกี่ยวกับ css ครับ ทำไม่ได้ซักที่ ใครก็ได้ช่วยหน่อย คือมันเป็นแบบนี้อ่าครับ ผมอยากให้รูปต่างๆ มันไปอยู่ตรงกลาง ทำไงดี

<div class="bg" >
	<img src="108live/bg90.jpg" />
        <div class="text">	   
            <div class="logo">
                <img src="108live/Untitled-2.png" />
            </div>
            <div id="red">
                <img src="108live/Untitled-4.png" />
            </div>
            <div id="blue">
                <img src="108live/Untitled-5.png" />
            </div>
            <div id="live">
                <img src="108live/108.png" />
            </div>
            <div id="item1">
                <img src="108live/Untitled-7.png" />
            </div>
            <div id="item2">
                <img src="108live/Untitled-8.png" />
            </div>
            <div id="item3">
                <img src="108live/Untitled-9.png" />
            </div>
        </div>
</div>

body{
	background-color:#051300;
	text-align:center;
	width:100%;
	min-width:980px;
	margin:0 auto;
	display:block;
}
.text{
	width:980px;
	margin-left:auto;
	margin-right:auto;
	display:block;
}
.bg{
	position:relative;
	width:100%;
	min-width:980px;
	z-index:1;
	display:block;
}
.bg img{
	width:100%;
	min-width:980;
	height:auto;
}
.logo img{
	width:300px;
	position:absolute;
	left: 70px;
	top:0px;
	z-index:2;
}
#red img{
	width:250px;
	position:absolute;
	left: 70px;
	top: 110px;
	z-index:2;
}
#blue img{
	width:350px;
	position:absolute;
	left: 670px;
	top: 135px;
	z-index:2;
}
#live img{
	width:400px;
	position:absolute;
	left: 330px;
	top: 110px;
	z-index:2;
}#item1 img{
	width:300px;
	position:absolute;
	left: 300px;
	top: 190px;
	z-index:2;
}
#item2 img{
	width:300px;
	position:absolute;
	left: 430px;
	top: 300px;
	z-index:2;
}
#item3 img{
	width:300px;
	position:absolute;
	left: 320px;
	top: 400px;
	z-index:2;
}