Bueno, en este caso, solo resta centrar la pagina y que automatice la resolucion de la cual tu la programaste. Checa este codigo. Recuerda hacer un Backup del codigo antes de insertar el nuevo:
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es">
<head>
<style type="text/css" media="screen" title="Resolucion Acordada a tu navegador">
* {
border: 0px;
padding: 0px;
margin: 0px;
}
.base {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
background-color: #ff0000;
}
.segunda {
position: absolute;
left: 10%;
margin-right: 10%;
top: 10%;
padding-bottom: 10%;
background-color: #00ff00;
width: 80%;
}
</style>
<script type="text/javascript">
function ajustar() {
if (navigator.appName != "Microsoft Internet Explorer") {
var altura = (window.innerHeight - 0);
document.getElementById('base').style.height = altura+'px';
} else {
document.getElementById('base').style.height = "100%";
}
}
function ajustar2() {
if (navigator.appName != "Microsoft Internet Explorer") {
var altura = (window.innerHeight - 200);
// resto 200, porque el 20% de 1024 es más o menos 200.
// este código aun debería mejorarse de manera que reste una cantidad adecuada a cada resolución
document.getElementById('segunda').style.height = altura+'px';
} else {
document.getElementById('segunda').style.height = "80%";
}
}
</script>
<title>Centrar vertical y horizontalmente</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body onload="javascript:ajustar(); ajustar2()">
<div class="base" style="height: 1px;" id="base">
<div class="segunda" style="height: 1px;" id="segunda">
</div>
</div>
</body>
</html>
