hola buenas, tengo un html con css que no se como hacer para que se ajuste un div que contiene una imagenal tamaño que tenga la pantalla.
les enseño el html:
Código HTML:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Voluntas Aragón
</title>
<style type="text/css">
*{margin:0;padding:0;}
body {background:url(voluntas_patron_fondo_web.png) repeat; z-index:5; width:100%; height:100%;}
#a{border:0;border-color:no;}
/*ESTO SE EJECUTA SOLO SI ES INTERNET EXPLORER*/
#fondo1ie {position:absolute; z-index:10; width:100%; height:100%;}
#logoie{position:absolute; z-index:50; width:240px; margin-left:-120px; left:50%; padding-top:10px;}
#formie{position:absolute; z-index:50; width:535px; margin-left:-267px; left:50%; text-align:center;}
/*ESTO SE EJECUTA SOLO SI --NO-- ES INTERNET EXPLORER*/
#fondo1{ position:fixed; z-index:10; width:100%; height:100%;}
#logo{position:absolute; z-index:50; width:240px; margin-left:-120px; left:50%; padding-top:10px; }
#form{position:absolute; z-index:50; width:535px; margin-left:-267px; left:50%; text-align:center;}
.campo{background: transparent; border: 1px Solid transparent; font-family: Verdana, Geneva, sans-serif; font-weight: bold; padding-left:2px;}
#logo #form #form table tr td { text-align: right; }
#logo #form #form table { text-align: right; font-family: Verdana, Geneva, sans-serif; font-weight: bold; }
#logo #form #form button { font-family: Verdana, Geneva, sans-serif; font-weight: bold; }
</style>
</head>
<body leftmargin="0px" topmargin="0px" bottommargin="0px" rightmargin="0px">
<div id="prin">
<!--[if IE]><div id="fondo1ie"><![endif]-->
<!--[if !IE]> -->
<div id="fondo1">
<!-- <![endif]-->
<img src="deg.png" width="100%" height="100%"/>
</div>
<!--[if IE]><div id="logoie" align="center"><![endif]-->
<!--[if !IE]> -->
<div id="logo" align="center">
<!-- <![endif]-->
<img src="Voluntas_logo_V.png" width="240" height="325" align="center"/>
<br>
<br>
<!--[if IE]><div id="formie"><![endif]-->
<!--[if !IE]> -->
<div id="form">
<!-- <![endif]-->
<p>
<img src="voluntas_filete_superior.png" width="535" height="25">
</p>
<p>
<br>
<img src="Voluntas_texto_campos.png" width="535" height="72">
</p> <br />
<form action="enviar.php" method="post" name="contacto" id="form" onSubmit="javascript:alert('Ya tenemos tus datos')">
<center>
<table width="0" border="0" cellspacing="5" cellpadding="5">
<tr>
<td align="right">
<label for="nombre" class="campo">Tan solo dinos tu nombre
</label></td> <td>
<!--[if IE]><input id="nombre" name="nombre" type="text" value="___________________" onFocus="if (this.value=='___________________') this.value='';" placeholder="___________________" required class="campo"><![endif]-->
<!--[if !IE]> -->
<input id="nombre" name="nombre" type="text" placeholder="___________________" required class="campo">
<!-- <![endif]--> </td>
</tr>
<tr>
<td align="right">
<label for="apellido" class="campo">apellido
</label></td> <td>
<!--[if IE]><input id="apellido" name="apellido" type="text" value="___________________" onFocus="if (this.value=='___________________') this.value='';" placeholder="___________________" required class="campo"><![endif]-->
<!--[if !IE]> -->
<input id="apellido" name="apellido" type="text" placeholder="___________________" required class="campo">
<!-- <![endif]--> </td>
</tr>
<tr>
<td align="right">
<label for="nombre" class="campo">y correo electrónico
</label></td> <td>
<!--[if IE]><input type="email" id="email" name="email" value="___________________" onFocus="if (this.value=='___________________') this.value='';" placeholder="___________________" required class="campo"><![endif]-->
<!--[if !IE]> -->
<input type="email" id="email" name="email" placeholder="___________________" required class="campo">
<!-- <![endif]--> </td>
</tr>
<tr>
<td colspan="2">
<center>
<button type="submit">Enviar
</button>
</center></td>
</tr>
</table>
</center>
<img src="voluntas_filete_inferior.png" width="535" height="25">
<p>
<a href="http://www.facebook.com/profile.php?id=100002236836566">
<img src="Voluntas_logo_facebook.png" width="36" height="36" border="0"></a>
</p>
</form>
</div>
</div>
</div>
</body>
</html>
si abren
http://www.revistavoluntas.com/pruebas/ con internet explorer y con firefox para hacer la prueba.
En firefox funciona como quiero: si reducen la pantalla a un tamaño muy pequeño y hacen scroll la imagen del div fondo1 que es deg.png se ajusta a todo el contenido
En explorer hacen lo mismo y al hacer scroll hacia abajo el fondo que es un degradado se corta en altura.
No se como solucionarlo, si me pueden echar una mano se lo agradezco de antemano ya.