Cómo hacer flotar el texto a la parte inferior de un DIV

Posicionamiento y la flotación de los elementos HTML se hace usando Cascading Style Sheets código. El método utilizado para flotar texto a la parte inferior de su elemento que contiene, como un div, implica el uso de la posición absoluta y relativa. Cuando le das a una posición absoluta al texto dentro de un div que tiene un ajuste de posición relativa, el texto se verá limitado dentro del div. Una vez hecho esto, se puede establecer "inferior" a un valor de cero para colocar el texto en la parte inferior de la div.

Instrucciones

1 Abra la página Web en el Bloc de notas o un programa de edición de código. Busque el div donde desea flotar texto al fondo y encontrar su nombre ID:

<Div id = "contenido">

<P> texto para flotar a la parte inferior. </ P>

</ Div>

2 Añadir un nombre de identificación para el conjunto de etiquetas que se colocan alrededor del texto que desea flotar a la

fondo:

<P id = "fondo"> texto a flotar a la parte inferior. </ P>

Envolver "<p>" etiquetas o "<div>" etiquetas de todo el texto si aún no está contenido en su propio conjunto de etiquetas.

3 Ir a la parte superior de su código, y localizar los "<style>" etiquetas. Añadir estas etiquetas si no los ve:

<Style type = "text / css">

</ Style>

Escribir todo el código CSS entre los "<style>" etiquetas. Si utiliza hojas de estilo externas con sus sitios web, añade el nuevo código CSS para el archivo CSS correspondiente.

4 Dele a su div un ancho fijo y altura. Establecer la propiedad "posición" de la div a "relativo":

contenido {

Anchura: 500px;

altura: 200px;

position: relative;

}

Cambiar el "contenido" al nombre de ID de su div.

5 Utilice el siguiente regla de estilo para forzar el texto a la parte inferior de la div:

fondo {

position: absolute;

parte inferior: 0;

}

Cambiar "inferior" al nombre de identificación que le diste a las etiquetas envueltos alrededor de su texto.