Centering Div in the middle of the page
- by shinjuo
What is the best way to center the entire page in the middle of the web browser?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>test.html</title>
<style type="text/css">
.testimonials_png
{
position: absolute;
left:20px;
top:397px;
width:220px;
height:395px;
background: url("test_files/testimonials.png") no-repeat;
}
.homeLink_png
{
position: absolute;
left:-1px;
top:243px;
width:203px;
height:75px;
background: url("test_files/homeLink.png") no-repeat;
}
.sidingLink_png
{
position: absolute;
left:202px;
top:243px;
width:180px;
height:75px;
background: url("test_files/sidingLink.png") no-repeat;
}
.windowsLink_png
{
position: absolute;
left:382px;
top:243px;
width:181px;
height:75px;
background: url("test_files/windowsLink.png") no-repeat;
}
.roofingLink_png
{
position: absolute;
left:563px;
top:243px;
width:183px;
height:75px;
background: url("test_files/roofingLink.png") no-repeat;
}
.aboutLink_png
{
position: absolute;
left:746px;
top:243px;
width:205px;
height:75px;
background: url("test_files/aboutLink.png") no-repeat;
}
.banner_png
{
position: absolute;
left:0px;
top:0px;
width:950px;
height:243px;
background: url("test_files/banner.png") no-repeat;
}
</style>
</head>
<body>
<div class="testimonials_png"> </div>
<div class="homeLink_png"> </div>
<div class="sidingLink_png"> </div>
<div class="windowsLink_png"> </div>
<div class="roofingLink_png"> </div>
<div class="aboutLink_png"> </div>
<div class="banner_png"> </div>
</body>
</html>
