2010 enero 14 « “Habitos Informáticos”

Archivo

Archivo para enero 14, 2010

CSS Vertical align

enero 14, 2010 gajupo Deja un comentario

En la etiqueta HTML td tiene un atributo llamado “valign”, que puede alinear el contenido verticalmente. CSS no tienen tal atributo, por lo que tiene que hacer un poco de magia para lograr tal resultado. Utilizando el método descrito a continuación usted será capaz de alinear un elemento verticalmente en cualquier contenedor de altura.

Ejemplo:

<html>
<head>
    <title>DEMO: CSS vertical align</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <style type="text/css">
		.v-outer {
			display: table;
			#position: relative;
			overflow: hidden;
			height: 100px;
			background: black;
			color: white;
			width: 100%;
		}

			.v-middle {
				display: table-cell;
				#position: absolute;
				#top: 50%;
				vertical-align: middle;
			}

				.v-inner {
					#position: relative;
					#top: -50%;
				}
	</style>
</head>

<body>

	<div class="border v-outer">
	<div class="v-middle">
	<div class="v-inner">
	...content...
	</div>
	</div>
	</div>

</body>
</html>

Categorías:1

L	M	X	J	V	S	D
« feb				feb »
				1	2	3
4	5	6	7	8	9	10
11	12	13	14	15	16	17
18	19	20	21	22	23	24
25	26	27	28	29	30	31

“Habitos Informáticos”

Archivo

Css rounded buttons

Codigo HTML:

CSS:

Imágenes:

CSS Vertical align

Calendario

Sigueme

Categorías

Posts Más Vistos

Follow “"Habitos Informáticos"”