Algunos condicionales css que suelo usar…

Bueno, mientras trabajaba con el css de un cliente, se me ocurrio escribir este post... Muchas veces los diseñadores web nos encontramos con problemas de diversos tipos a la hora de maquetar una web por medio de css ( hay problema con los navegadores, los margenes no son los mismos, las medidas no se respetan, etc. etc. ). Tenemos distintas alternativas para eludirlos: muchos recurren a los Hacks (por medio de scripts), otros simplemente crean un nuevo css para un bronwser en especifico y otros (como yo) usamos "condicionales", condicionales? sip, o por lo menos asi los llamos yo :P


Por ejemlpo, tenemos un "margin: 0 0 10px 15px;" y en IE6 el margen se deforma y se hace un poco mas largo, ¿que podemos hacer entonces?:

CSS:
  1. #div {
  2.         margin: 0 0 10px 15px;
  3.         _margin: 0 0 5px 15px;
  4.        }

Por medio del guión bajo ( _ ) le indicamos al css que solo nos estamos refiriendo a internet explorer 6 por lo tanto, todos los atrivutos que especifiquemos con un guion bajo adelante, nada mas seran atribuidos a IE6...


¿Que pasaria si el problema de margenes no solo esta en IE6, sino tambien en EI7?

CSS:
  1. #div {
  2.         margin: 0 0 10px 15px;
  3.         *margin: 0 0 5px 15px;
  4.        }

Con un simple asterisco (*) por delante del atributo, el css entiende que solo nos estamos referiendo a IE6 e IE7, sip ambos navegadores.


y... ¿si el problema esta solo en IE7?

CSS:
  1. #div {
  2.         margin: 0 0 10px 15px;
  3.         *margin: 0 0 5px 15px !important;
  4.        }

A traves del asterisco (*) al inicio y el "!important" al final, nos referimos unicamente al IE7


También podemos conbinar los condicionales si queremos atribuir distintos valores a los distintos browsers, por ejemlpo:

CSS:
  1. #div {
  2.         margin: 0 0 10px 15px;
  3.         *margin: 0 0 5px 15px;
  4.         *margin: 0 0 7px 15px !important;
  5.        }

De esta forma 10px de margen inferior sera para Firefoxs, 7px sera para IE7 y 5px sera para IE6...


y por ultimo, si solo queremos modificar algun atributo solo en Firefoxs, haremos lo siguiente:

CSS:
  1. #div {
  2.         margin: 0 0 10px 15px;
  3.         margin: 0 0 5px 15px !important;
  4.        }

Con el "!important" al final, se entiende que solo hablamos de Firefoxs...



more

Lucas
February 6th, 2008

Oriental Gallery - Una increible galeria de diseños orientales

Si hay algo que disfruto hacer, es conocer "cosas" que jamas habia visto... en esta oportunidad le llego el turno a "Oriental Gallery", una galeria muy interesante que se encarga de mostrar los mejores diseños orientales.

enlace
*Nota: les recomiendo que archiven o guarden este link, ya que no son muchas las veces en que uno por casualidad se topa con este tipo de aplicaciones, ya que por temas de compatibilidades y demás... la cuestión se vuelve un poco complicada :)

Lucas
February 3rd, 2008

Construye una Hackintosh por menos de $800


jajaja... que sorpresa me lleve al leer este post ( :P ) de los muchachos de "lifehacker", en el cual nos enseñan a construir nuestra propia "mac" por menos de 800 dolares. Si estan pensando actualizar su computador como "yo" les recomiendo que lo tengan en cuenta :)


enlace

Lucas
February 3rd, 2008

99 sitios que no podes dejar de ver - segun Split Da Diz

uhf... que interesante recopilacion sitios, hechenle un vistazo:

Lucas
February 3rd, 2008

Preparence! CRECE! se acerca!

Para aquellas personas que se preguntan porque hace tanto que no escribo en el blog, bueno les comento que se debe a que tengo mucho trabajo, muchisimo realmente. Lo cual no es para nada malo, sino al contrario, pero me saca mucho tiempo que puedo dedicar al blog. Pero no se preocupen, estoy trabajando en un nuevo proyecto llamado "CRECE!" en el cual me gustaria que todos formaran parte de él, y si quieren lo haran. Por ahora no quiero adelantar nada...


Saludos,
Lucas.

Lucas
January 24th, 2008