Una vez me dio problemas una Web donde necesitaba precisamente esto.

Si necesitáis poner totalmente centrada una capa en el navegador, aquí tenéis el código. Eso si, debe ser una capa de tamaño fijo…

div {
position: absolute;
top: 50%; /* Buscamos el centro horizontal (relativo) del navegador */
left: 50%; /* Buscamos el centro vertical (relativo) del navegador */
width: 600 px; /* Definimos el ancho del objeto a centrar */
height: 400px; /* Definimos el alto del objeto a centrar */
margin-top: -200px; /* Restamos la mitad de la altura del objeto con un margin-top */
margin-left: -300px; /* Restamos la mitad de la anchura del objeto con un margin-left */
}

¡Podéis ver el artículo completo en la Web Ateneupopular.com (Tenéis enlace en la columna derecha también) si necesitáis más detalles!

Tutorial completo Ver Contenido‘

Con el reciente cambio de diseño de la Web de W3C aprovecho para marcar su validador como Web de referencia.

¡A validar! Ver Contenido‘

Todo lo que ayude a una interfaz más cómoda y rápida es necesario. Prueba de ello son los, tan de moda, formularios con autocompletar (Véase ebay y ciertas redes sociales).

En enlace siguiente hay algunos ejemplos y tutoriales para hacer formularios que autocompletan las búsquedas al estilo de yahoo, facebook, etc. y fácilmente customizables.

Ver Contenido‘

Normalmente usan Jquery o Frameworks parecidos. Toca destripar código.

Un código de lo más sencillo para crear menús con contenido en pestañas.

Podéis descargar todo lo necesario con el archivo adjunto.

Ver Demo / Sitio Web Ver Contenido‘

– Archivo Adjunto: s-tabs.zip

Me ha costado sangre encontrar este script para personalizar Listbox de un formulario con imágenes.

Usa JQuery y podéis encontrar información: Ver Contenido‘

Ejemplo: Ver Contenido‘ (Pulsar en Choose an icon para ver el efecto)

El código lo podéis descargar el archivo adjunto.

– Archivo Adjunto: select.rar

Todos los que maquetamos sabemos el coñazo que supone montar ciertas maquetas.

Gracias a Frameworks como este es posible acelerar el proceso de maquetación.

El caso que nos ocupa es Blueprint y no hay mejor forma de ver lo cómodo de su funcionamiento que echando un vistazo a este ejemplo Ver Contenido‘

Descargar: Ver Contenido‘

Web Oficial: Ver Contenido‘

Seguro que muchos de los programadores que lean estas lineas han utilizado esos calendarios que al pulsar el icono de turno muestra una pequeña ventana donde elegir el día y que el input de al lado se rellene con esa fecha, pues bien, he encontrado este script con JQuery, que la verdad presenta un resultado genial.

Se puede customizar con CSS y admite numerosas variables que lo adaptarán rapidamente a tu formulario.

Ver Contenido‘

Ha continuación os dejo una clase que te permitirá poner cualquier objeto de tu Web con la transparencia que necesites.

Todos los objetos en una web son 100% opacos, con estos filtros podemos bajar el efecto hasta hacerlos transparentes.

La primera linea, segunda y tercera son para Explorer. Solo la primera debería valer pero en ciertas ocasiones el render se le va la cabeza y no muestra el efecto si no se acompaña de alguna propiedad más como puede ser Float o Width.

La cuarta linea es para Firefox y la quinta para versiones anteriores de Firefox.

Así que con este código completo no deberíais de tener problema en ningún explorador.

.claseopacidad {
filter:alpha(opacity=25);
width: 120px;
float: left;
opacity: .25;
-moz-opacity: .25
}

Gracias a esta Web podéis confeccionar vuestro propio menú en CSS, admite todo tipo de configuraciones y parámetros como color y tamaños.

El proceso se lleva a cabo íntegramente por la Web y al final solo tendréis que copiar y pegar el código del menú.

Ver Contenido‘

Un lastre que solemos llevar todos los diseñadores es el de los campos de formulario para subir archivos (fotos, PDF, etc.) Son muy feos! Y difíciles de modificar mediante CSS…

Con este método, usando CSS y DOM, podremos customizar la imagen y quitar el campo de texto. Echarle un ojo a la demo, la funcionalidad sigue siendo la misma pero con un look mucho más fácil de integrar.

· Demo Ver Contenido‘

– Archivo Adjunto: inputcss.rar