Axterixv: apunta que tenemos otro "Cosas Básicas Universal"
Cómo hacer una caja con sombra, independientemente del tamaño de esta:
Código:
<!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>
<title>Caja con sombra</title>
<style type="text/css">
body { background-color: rgb(2, 201, 222);
}
#caja, #contenido, #supder, #infder { background-image: url(ejemplo_sombra.png);
background-repeat: no-repeat;
}
#caja { width: 600px;
background-position: left bottom;
overflow: auto;
margin-left: auto;
margin-right: auto;
}
#contenido { padding: 20px;
float: left;
position: relative;
}
#texto {}
#supder { background-position: right top;
}
#infder { float: right;
background-position: right bottom;
width: 20px;
height: 20px;
}
.corte { clear: both;
}
</style>
</head>
<body>
<div id="caja">
<div id="supder">
<div id="contenido">
<div id="texto">
<p>Un texto para comprobar</p>
<p>La segunda
línea</p>
<p>Una tercera
línea más larga que las anteriores para provocar
un salto de línea y ver si se corta donde debe</p>
</div>
</div>
<div class="corte"></div>
</div>
<div id="infder"></div>
</div>
</body>
</html>
Y pongo el enlace para que se pueda coger el gráfico:
http://www.menoslobos.com/mikel/foro...ja_sombra.html
Sólo hay que adaptar el gráfico al fondo de la página.
Mikel.
P.D.: gracias por el vínculo del scroll, nefertiter. Ya nos enseñarás.