Daniel Mota / IceBeat

Mi vida en formato CSS3

Estás en la bitácora de IceBeat, una página sobre diseño y desarrollo web.

Orden de propiedades en CSS II

No hemos podido encontrar el articulo pero a todos nos suena, al final hemos llegado en los comentarios a un acuerdo y suponemos que la mejor forma de organizar las propiedades CSS es ir desde afuera para adentro.

Comportamiento

  • display
  • overflow
  • clear

Posición

  • position
  • float
  • top

Tamaño

  • height
  • width

Margenes y bordes

  • margin
  • border
  • padding

Texto

  • font
  • text
  • line-height

Fondos y colores

  • background
  • color

No pasa nada si no utilizas ningún orden pero es algo que se agradece cuando el volumen de código aumenta.


Orden de propiedades en CSS

Ando buscando un articulo que ley hace tiempo sobre el orden de las propiedades en las hojas de estilos, por mucho que pregunto al señor google y a los expertos no doy con el enlace.

Trata de saber el orden adecuado para escribir CSS, no el orden de la hoja de estilos, sino saber si primero ha de ir los margins y padddings, luego las fuentes, los colores, etc..

Os suena?


Iconos 2.0 PSD

Después de un largo periodo sin postear (debido a la falta de recursos, no por el tiempo) vuelvo para liberar los iconos que en su día mostré en mi PFC.

Preeparados en formato PSD y con capas separadas para poder cambiar la forma de la chapa.

iconos

Descarga

Buen provecho.

Actualización:

Chema de Robot04 ha modificado un poco los iconos y la verdad es que han quedado de vicio.

Descarga la versión de Chema:

Muchas Gracias :).


Position absolute y relative

Este tip puede ser una tontería pero es algo que a simple vista no se tiene en cuenta.

Cuando usamos position absolute sabemos que la capa se mueve con las propiedades top,left, right y bottom, pero si la caja contenedora tiene position relative el elemento se mueve en relación al tamaño de la caja y no de la página web.

Lo vemos por ejemplo para redondear capas o añadir sombras.

<div>
    <h3>Hola!</h3>
</div>

div {
position:relative;
}

div h3 {
position:absolute;
top:0;
left:0;
}

La diferencia de usar position relative la puedes ver en este pequeño gráfico.

relative


Skin DS r4

Hace unas semanas o así intente contribuir con la comunidad creando una skin para la r4, la primera parte es la que veis pero la segunda anda aun un poco floja.

r4

También hay que tener en cuenta que no acepta toda la gama de colores y en la DS se remarca bastante el degradado. Las pantallas de elección de juegos es la que me tiene mosca, no me termina de convencer así que la he dejado reposando. Seguro que tarde o temprano daré con la clave jeje.

Página 2 de 11 · Mostrar 5 más