JMiur [E]

Esto no es para copiar, esto no es para aprender, esto no es para ... nada excepto soprenderse por lo que vendrá y pasarse un rato largo intentando meter tanta cosa en una entrada de Blogger.

Pure CSS Fail Whale by Steve Dennis es eso, un dibujo realizado enteramente con CSS cuyo autor debe haberse tomado unas merecidas vacaciones luego de escribir semejante cantidad de códigos.

Lo que veremos dependera del navegador que utilicemos; en Internet Explorer no será otra cosa que un dibujo torpe [ ver captura ]; en Firefox 3.6 y Opera, será un dibujo estático; en Chorme y Safari será una animación que es el preludio de lo que nos depara el futuro, cuando el resto de los navegadores incorporen las propiedades necesarias.

Click para ver el resultado.


11 comentarios:

@rielCastellanos  

Como? que? este es un verdadero artista!

Responder
Paula  

¡¡un gran trabajo se mando el pibe!!

Responder
Candela MG  

Guau! Qué trabajo! Y como siempre, Explorer un paso por detrás.

Responder
Unknown  

Juro ante Vagabundia, por Blogger, IE, Mozilla, Opera...no intentar hacerlo, ni copiarlo!

Ya lo había visto, pero no sabía que era con CSS ohhh mi mae sí que hay que tener cabecita para realizar la ballenita y los pajarillos :P

Responder
Unknown  

Superior!

Responder
Diseñofílica  

¡Wow! :O

Yo no sé si podría estar tanto tiempo jugando con los códigos sólo por amor al arte :P.

JMiur, quería hacerte una consulta rapidita que no tienen que ver con el tema (:$):

¿Cómo puedo cambiar las viñetas de la lista de comentarios recientes por íconos? No es tan fácil como las de los posts y por eso estoy confundida :S.

Agradecería muchísimo tu ayuda, porque de plano ya no sé que hacer :P.

¡Saludos!

Responder
Ana Laura  

Increíbles las diferencias entre los navegadores, aparte de la genialidad con CSS, un ejemplo bien práctico para mostrárnoslas.

Un saludo!!

Responder
JMiur  

Es bastante loco ponerse a hacer estas cosas pero bueno ... por suerte, hay locos :D

M A M B A:
Podrías colocarla como una imagen de fonto. Por ejemplo, algo así, colocaría la misma viñeta que veo en las listas de las entradas pero claro, puede ser cualquier otra imagen:

#HTML11 li {
background: transparent url(http://img294.imageshack.us/img294/4661/asterisco.png) no-repeat left top;
padding:0 0 0 15px;
}

Responder
Diseñofílica  

¡Muchas gracias! Ha dado resultado :D .

Además, logre quitar las viñetas agregando al final del código que me diste esto:

list-style: none;

Y ahora veo que podría configurarlas como en los posts, pero prefiero dejarlo así, no tiene caso complicarse tanto.

Muchas gracias de nuevo, sin ti nunca hubiera arreglado el problema :P.

Responder
JMiur  

Me alegro que funcionara :D

Responder
Karla Castañeda  

Jajaja buenísimo, ... si no necesitó unas buenas vacaciones, por lo menos si un buen masaje en las sentaderas jajaj.. :D

Responder

¿Quiere dejar un comentario?

recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

Nota: sólo los miembros de este blog pueden publicar comentarios.

Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

 
CERRAR