Cómo anclar un DIV al pie de una página

HTML es el lenguaje base utilizado para crear documentos de Internet y basados en la web.
Por gary fish

Cómo anclar un DIV a la parte inferior de la página de un sitio web


Paso 1

Introduce el código DIV básico de pie de página en tu editor HTML. El código deberá ser similar a esto:

<div id="footer"> <div class="wrap"> <p>Insert content here.</p> </div> </div>

Este es el código para el DIV que deseas anclar al pie de la página HTML.


Paso 2

Agrega una regla CSS a la hoja de estilo para el contenedor, el encabezado y el pie de página de tu página. La hoja de estilo CSS debería tener este aspecto:

.wrap { position:relative; margin:0 auto; width:960px; }

header, #footer {

width:100%; float:left; }

El ancho del contenedor de 960 píxeles se deberá cambiar para adaptarse a las dimensiones de la página que estés creando.


Paso 3

Añade código adicional para el CSS que se aplica sólo al DIV que deseas anclar a la parte inferior de la página. El código debería tener este aspecto:

footer {

position:fixed; bottom:0; z-index:999999; }

Este código anclará el DIV al pie de la página independientemente de lo que se añada o se quite de la página.