Ver Mensaje Individual
  #2 (permalink)  
Antiguo 19/12/2007, 09:22
Avatar de webosiris
webosiris
Moderador egiptólogo
 
Fecha de Ingreso: febrero-2002
Ubicación: Luxor, Egipto
Mensajes: 10.725
Antigüedad: 22 años, 9 meses
Puntos: 998
Re: Consulta teorico/práctica

hola, bienvenido a FdW

Cita:
Me gustaría que alguien me explicara un poco mejor cual es el funcionamiento de los valores negativos en los margin
te voy a explicar la técnica que generalmente uso para posicionar el pie de una página siempre al final independientemente del contenido, aunque la explicación teórica sobre margenes negativos sea aplicable a cualquier cosa

margin-top se podría definir como "la distancia que hay entre el borde superior del elemento al que se le aplica margin al borde inferior del elemeto anterior".... osea, si tenes
Cita:
<div id="contenedor"></div>
<div id="pie"></div>
#pie{margin-top:100px} haría que la distancia entre el borde superior de #pie y el borde inferior de #contenedor fuera 100px. Hasta ahí la explicacion de lo márgenes "positivos".

Los márgenes negativos siguen la misma lógica, en este ejemplo con #pie{margin-top:-100px} los bordes seguirían separados 100px solo que para el "otro lado". Y eso lleva a que, si #pie tiene una altura de 100px, quede completamente "montado" sobre los últimos 100px de #contenedor, coincidiendo el borde inferior de #pie con el borde inferior de #contenedor.
Si a esto le sumamos que al #contenedor le aplico min-height:100% (lo que hace que su altura mínima sea siempre el 100% del alto de la ventana) obtenemos un pie que siempre queda pegado al borde inferior de la ventana aún cuando no hay suficientemente contenido para llenarla toda :)

Espero no haberte confundido al introducirte otro ejemplo más, pero creo que es el ejemplo en que más facilmente se pueden entender los márgenes negativos
__________________
Pasamos tus PSD a HTML

Pobre del que lo sabe todo, porque no tiene nada más que aprender ni razón para vivir. -