jhuss blog » 2008 » Enero http://jhuss.com ...Un Mundo Libre por descubrir... Fri, 25 Jul 2008 03:23:42 +0000 http://wordpress.org/?v=2.5.1 en Pie de pagina al final con CSS http://jhuss.com/2008/01/24/pie-de-pagina-al-final-con-css/ http://jhuss.com/2008/01/24/pie-de-pagina-al-final-con-css/#comments Thu, 24 Jan 2008 18:49:39 +0000 jhuss http://jhuss.com/2008/01/24/pie-de-pagina-al-final-con-css/ Les ha ocurrido que tiene una pagina y el contenido no llena toda la ventana, y el pie de pagina esta a continuación del contenido quedando el resto de espacio libre.

o simplemente quieren que el pie de pagina este siempre al final se cual sea el caso, pues buscando en Internet encontré una forma de hacerlo con solo css.

primero un ejemplo de la idea expuesta con las siguientes imágenes.

de tener una pagina con una estructura similar:
pie inicial

a esta otra:
pie final

para poder entender como se hace esto, es necesario tener algo de conocimiento de HTML y CSS, en google pueden busca mucha documentación ;)

con CSS debemos hacer que la etiqueta <body> el alto mínimo sea de 100%, creamos una etiqueta <div> principal que va a contener todo, menos el pie de pagina, que seria otra etiqueta <div>.

la etiqueta <div> principal también va a ser de alto mínimo de 100% pero con la diferencia que va a tener el margen inferior negativo :D ya por acá esta el truco, ese margen negativo debe ser en numero igual al lo alto de la etiqueta del pie de pagina.

pero ahora se necesita otra etiqueta <div> vacía, que también debe ser del mismo tamaño del pie de pagina, esto por que?
bueno la etiqueta <div> principal tiene margen negativo, y al colocar el pie de pagina, estaría a la misma altura, así que hay que crear una etiqueta vacía del mismo tamaño del pie de pagina pero esta vez va dentro de la etiqueta principal para separarla de pie de pagina real.

ya explicado como es que funciona, un ejemplo en código HTML y CSS, yo uso clases (class) en el CSS, también es valido usar ID:

el HTML:

<body>
<div class="body">
    <span>jhuss.org</span>
    <div class="nopie"></div>
</div>
<div class="pie">
    <div>2008 - [jhuss~]#</div>
</div>
</body>

el CSS:

body {
    height: 100%;
    margin: 0px 0px 0px 0px ;
}
div.body {
    min-height: 100%;
    height: 100%;
    margin-bottom: -60px;
    position: relative;
}
div.nopie {
    height: 60px;
    clear: both;
}
div.pie {
    height: 60px;
    position: relative;
}

la solución es gracias a este post en ingles: http://fortysevenmedia.com/

saludos.

]]> http://jhuss.com/2008/01/24/pie-de-pagina-al-final-con-css/feed/ Afiche CNSL4 http://jhuss.com/2008/01/17/afiche-cnsl4/ http://jhuss.com/2008/01/17/afiche-cnsl4/#comments Thu, 17 Jan 2008 06:44:50 +0000 jhuss http://jhuss.com/2008/01/17/afiche-cnsl4/ saludos, acá dejo el afiche que hice como propuesta para el CNSL4, al parecer en la votación fue el que gano :P

gracias a todos los que votaron por el.

ver-afiche-cnsl4

]]> http://jhuss.com/2008/01/17/afiche-cnsl4/feed/ 101 cosas sobre mi (como no xD) http://jhuss.com/2008/01/11/101-cosas-sobre-mi/ http://jhuss.com/2008/01/11/101-cosas-sobre-mi/#comments Fri, 11 Jan 2008 16:40:13 +0000 jhuss http://jhuss.com/2008/01/11/101-cosas-sobre-mi/ bueno para fastidiar un rato, me tome la molestia de escribir algo, y va así:

# -*- coding: utf-8 -*-

import random

var101 = ["me gusta la música estilo post-rock",
    "me gusta programar",
    "me gustaría aprender a tocar guitarra",
    "me gusta la música electrónica",
    "me gusta Linux",
    "me gusta el dibujo por computadora",
    "me gusta la oscuridad",
    "no me agrada mucho la gente chepa de profesión",
    "no me agrada la mentalidad 3er mundista",
    "no puedo vivir sin Internet xD",
    "no me gusta dar información personal",
    "<dejado sin información intencionalmente>"]

var101len = len(var101)

for i in range(1, 102):
    randomvar = random.randrange(0, var101len)
    print i, “-”, var101[randomvar]

JA! esta en python y funciona jejeje

bueno yo no voy a andar escribiendo 101 cosas sobre mi a extraños :|

saludos xD

actualización: explicación, el script toma las 12 lineas que escribí y aleatoriamente las va repitiendo hasta las 101 lineas.

]]> http://jhuss.com/2008/01/11/101-cosas-sobre-mi/feed/ Feliz Cumpeaños Leydi :D http://jhuss.com/2008/01/11/feliz-cumpeanos-leydi-d/ http://jhuss.com/2008/01/11/feliz-cumpeanos-leydi-d/#comments Fri, 11 Jan 2008 05:07:28 +0000 jhuss http://jhuss.com/2008/01/11/feliz-cumpeanos-leydi-d/ bueno un pequeño post dedicado a leydi en su cumpleaños

:D feliz cumpleaños, que la pases bien y muchos regalos y muchos años mas y.. algún día vas a tener un gato de mascota jajaja, es broma :P

cumpleaños

]]> http://jhuss.com/2008/01/11/feliz-cumpeanos-leydi-d/feed/ Come Over por iLiKETRAiNS http://jhuss.com/2008/01/10/come-over-por-iliketrains/ http://jhuss.com/2008/01/10/come-over-por-iliketrains/#comments Fri, 11 Jan 2008 00:14:29 +0000 jhuss http://jhuss.com/2008/01/10/come-over-por-iliketrains/ The world was growing colder
And when the wind blows
The cradle will rock

Forwards and back
The cradle she swings
I’m caught in the middle
Between family and friends

So here’s to fallen friends
And to falling walls
I severed my roots
And the bow did break

And when the bow breaks
The cradle will fall

-

y feliz cumpleaños matica :D

]]> http://jhuss.com/2008/01/10/come-over-por-iliketrains/feed/ Pantalla Azul http://jhuss.com/2008/01/10/pantalla-azul/ http://jhuss.com/2008/01/10/pantalla-azul/#comments Thu, 10 Jan 2008 06:15:09 +0000 jhuss http://jhuss.com/2008/01/10/pantalla-azul/ feliz año a todos!
jajajajaja que bueno empezar el año nuevo con buen humor, en #unplug no se quien paso un gif, cuando lo vi me pude reír bastante.

es algo pequeño así que lo coloque un poco mas grande con gimp, tiene 2,1MB puede tardar algo en cargar

clic en la imagen para ver:
pantalla azul

]]> http://jhuss.com/2008/01/10/pantalla-azul/feed/