Crear un menú con estilos CSS es relativamente sencillo pero no siempre tenemos el tiempo o los conocimientos necesarios para hacer el menú que buscamos. Como ayuda existen 3 herramientas online que nos pueden resultar útiles:

izzymenu.com: Impresionante, para empezar nos da bastantes opciones para personalizar cada menú. Pero es que además cuenta con cientos de diseños predefinidos de muy buena calidad, tanto creados por los editores como por los propios usuarios. Incluso podemos generar menús animados con Jquery.

Su peor defecto es la forma exagerada de mostrar la publicidad, hasta en los archivos que descargamos aparece publicidad de su CMS (que por supuesto podemos eliminar). Otra desventaja es tener que registrarse para poder usar todas las opciones.

cssmenubuilder.com: Otra estupenda herramienta que además genera código bastante más “limpio”. Su galería de menús predefinidos en mucho más corta pero a cambio podemos modificarlos totalmente sin necesidad de tocar el código.

La única desventaja que le encuentro es que no podemos generar la estructura de enlaces desde la propia herramienta. Aunque tampoco es ningún drama pues la propia herramienta nos permite crearla a mano.

cssmenumaker.com: Una opción más simple, contamos con una galería de unos 80 diseños predefinidos pero que no podemos modificar estéticamente. Como ventaja si podemos generar la estructura sin salir de la herramienta, incluyendo submenús. Es interesante,  aunque mucho menos potente que las 2 anteriores.

Por supuesto, una vez tenemos el código del menú aun nos queda adaptarlo a nuestro sitio web. En la mayoría de los casos el único cambio necesario será cambiar la ruta de las imágenes en el código CSS, a menos que nos guste tenerlas mezcladas con los demás archivos.

Un ejemplo lo tenemos en las páginas web de varias columnas, cuando deseamos que todos los bloques tengan la misma altura independientemente de su contenido. Algo que muchas veces es difícil de conseguir solo con estilos CSS.

Un truco que he encontrado hace poco y funciona bastante bien es usar JavaScript, en concreto jQuery, para igual la altura. El código a usar es el siguiente:

function equalHeight(group) {
tallest = 0;
group.each(function() {
thisHeight = $(this).height();
if(thisHeight > tallest) {
tallest = thisHeight;
}
});
group.height(tallest);
}
$(document).ready(function() {
equalHeight($(".column"));
})

Obviamente también hay que cargar las librerías de jQuery en la página en cuestión y señalar que capas queremos que se ajusten en altura, añadiendo el siguiente parámetro a cada DIV:

class="column"

Sencillo y eficaz. Aunque espero que en futuras versiones de CSS esto se pueda hacer directamente sin recurrir a trucos.

Fuente (inglés): cssnewbie.com

Sitepoint ofrece de forma gratuita y solo durante unos días (luego volverá a costar 29.95$) el libro: The Art & Science of CSS, donde grandes expertos en la materia explican, entre otras cosas, como:

• Dar formato a calendarios, menús y tablas con contenido usando CSS.
• Crear sistemas de navegación horizontales, verticales y con pestañas mediante CSS.
• Crear bordes redondeados usando CSS.
• Diseñar cabeceras modernas y visualmente atractivas.
• Poner fondos a una página web divertidos y llamativos.
• Usar CSS para mejorar la apariencia de cuotas, fechas y listas.

Solo quedan 7 días para que termine la promoción, asi que si os interesa el libro descargadlo cuanto antes entrando en el siguiente enlace:

Promoción: The Art & Science of CSS

Y poniendo vuestra dirección de email en el campo correspondiente, en unos minutos recibiréis un correo electrónico con un enlace para descargar el libro gratis.

Tripoli es una hoja de estilos en cascada (CSS) diseñada para servir de base para un sitio web. Básicamente lo que hace es “resetear” los estilos por defecto que los navegadores aplican al representar una página web.

Es decir, cuando tú creas un sitio web modificas la apariencia de los distintos elementos que lo componen mediante estilos CSS. Pero los navegadores a su vez también aplican unos estilos por defecto a todas las páginas, lo cual provoca que entre distintos navegadores haya diferencias visibles en la colocación de los elementos o en el formato del texto. Pues Tripoli es un archivo CSS que sustituye en lo posible esos estilos por defecto por otros comunes a todos los navegadores y optimizados para que la página web se vea correctamente y el texto sea legible. Eso nos da varias ventajas:

-La principal es que nuestro sitio web se vera igual en todos los navegadores.
-También mejoraremos la lectura de los textos.
-Y nos ayuda a separar el contenido de los estilos visuales.

Existen alternativas a Tripoli, como por ejemplo Blueprint, pero para mi gusto Tripoli es el más austero y sencillo. Os animo a probarlo, en algunos proyectos puede resultar muy útil.