Ver Mensaje Individual
  #6 (permalink)  
Antiguo 26/04/2004, 15:47
Avatar de PatomaS
PatomaS
Colaborador
 
Fecha de Ingreso: marzo-2004
Ubicación: En alguna otra parte
Mensajes: 4.656
Antigüedad: 20 años, 8 meses
Puntos: 63
Posicionamiento de capas

Hola

Bueno, aquí dejo el código de 4 capas posicionadas en las 4 esquinas de una navegador, las dimensiones están ajustadas a mi pantalla y hechas rapidamente, con un pocquito más de calma, se puede lograr la perfección.

Código:
<?xml version="1.0" encoding="iso-8859-1"?>
<!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>
<style>
.arriba_izquierda {
	background-color: #ff0000;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 200px;
	height: 100px;
}
.arriba_derecha {
	background-color: #ff0000;
	position: absolute;
	top: 0px;
	left: 80.4%;
	width: 200px;
	height: 100px;
}
.abajo_izquierda {
	background-color: #ff0000;
	position: absolute;
	top: 82.4%;
	left: 0px;
	width: 200px;
	height: 100px;
}
.abajo_derecha {
	background-color: #ff0000;
	position: absolute;
	top: 82.4%;
	left: 80.4%;
	width: 200px;
	height: 100px;
}
</style>
<title>Posicionamiento básico de 4 capas</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>

<body>
<div class="arriba_izquierda">
esta capa sale pegadita<br />a la parte superior<br />izquierda de la pantalla
</div>
<div class="arriba_derecha">
esta capa sale pegadita<br />a la parte superior<br />derecha de la pantalla
</div>
<div class="abajo_izquierda">
esta capa sale pegadita<br />a la parte inferior<br />izquierda de la pantalla
</div>
<div class="abajo_derecha">
esta capa sale pegadita<br />a la parte inferior<br />derecha de la pantalla
</div>
</body>
</html>
Felicidad
__________________
¡ hey, hou, hou, hey !