Lunes ~ Octubre 29, 2007

Elegante listado simulado para nuestras aplicaciones

Aúnque técnicamente no se trata de un listado, se trata de uno de los “listados simulados” más elegantes que he visto nunca. Aunque con un poco de mano, podría convertirse en un listado semáticamente más correcto, creo que vale la pena conocerlo.

nicenumberedlists.jpg

HTML

<div class="comment-box">
      <h2 class="number">X</h2>
      <p>CONTENIDO</p>
   </div>

CSS 

h2.number {
	position: relative;
	top: 0px;
	left: 0px;
	font-size: 10em;
	color: #ccc;
	float: left;
	margin-right: 10px
}

.comment-box {
	margin: 0px 0px 50px 50px;
	padding: 20px;
	width: 240px;
	border: 1px solid black;
	float: left;
}

[Demo][Descargar]

Quizas te pueda interesar

Deja un comentarioTop

Me reservo el derecho de eliminar y/o modificar los comentarios que contengan lenguaje inapropiado, spam u otras conductas no apropiadas en una comunidad civilizada. Si tu comentario no aparece, puede ser que akismet lo haya capturado, cada día lo reviso y lo coloco en su lugar. Siento las molestias.

Esta web se encuentra sobre la licencia Creative Commons (Reconocimiento - Compartir igual) / Politicas de uso

Cerrar
Enviar por Correo