Há muitos plugins Jquery para se fazer menus dropdown bacanas, mas usar apenas CSS para isso é muito mais interessante, não é? É isso que vamos fazer a seguir.

Primeiro vamos estruturar nosso html, segue:

<ul id="menu"> <!-- Inicia o menu principal -->
    <li><a href="#">Home</a> <!-- Item normal do menu -->
    <li><a href="#" class="drop">Posts mais acessados</a> <!-- Item dropdown do menu, leva a class 'drop' para a adição da seta -->
        <div class="columns"> <!-- Inicia o box que conterá o conteúdo do dropdown -->
			<ul class="col"> <!-- Inicia o box de uma das 3 colunas com os links -->
				<span>WordPress</span> <!-- Título da coluna -->
				<li><a href="#">Nivo Slider For WordPress</a></li>
				<li><a href="#">Usando taxonomia e posts personalizados no WordPress 3.0</a></li>
				<li><a href="#">Correção do Módulo PagSeguro para WP-e-Commerce v3.2.4</a></li>
				<li><a href="#">Tutoriais do WordPress 3 – Posts Personalizáveis</a></li>
				<li><a href="#">WordPress + JQuery – Lista de categorias em Menu Accordion</a></li>
			</ul> <!-- fecha o box de uma das 3 colunas com os links -->
			<ul class="col">
				<span>JQuery/HTML/CSS</span>
				<li><a href="#">5 plugins JQuery para slider de imagens</a></li>
				<li><a href="#">Usando border-radius no IE</a></li>
				<li><a href="#">Instalando o TinyMCE no seu site</a></li>
				<li><a href="#">Alguns exemplos de HTML5</a></li>
				<li><a href="#">5 Livros que todo web designer deveria ler</a></li>
			</ul>
			<ul class="col">
				<span>Miscel&acirc;nea</span>
				<li><a href="#">Temas premium WordPress</a></li>
				<li><a href="#">Plugins premium WordPress</a></li>
				<li><a href="#">Plugins Premium CSS</a></li>
				<li><a href="#">Plugins Premium Javascript</a></li>
				<li><a href="#">Hospedagem de Site - UolHost</a></li>
			</ul>
        </div> <!-- Fecha o box que conterá o conteúdo do dropdown -->
    </li> <!-- Fecha item dropdown do menu -->
</ul> <!-- Fecha o menu principal -->

A explicação do html acima está nos próprios comentários do código

Agora vamos para o CSS, segue:

#menu {
	width:940px;
	margin:30px auto 0px auto;
	height:43px;
	border-bottom:1px solid #f5f5f5;
	list-style-type:none;
}
#menu li {
	float:left;
	position:relative; /* Importante para posicionar o conteúdo do dropdown*/
	height:43px;
	line-height:43px;
	padding:0 10px;
	margin-right:30px;
}
#menu li:hover {
	background: #f5f5f5;
}
#menu li a {
	font-size:14px;
	color: #ccc;
	display:block; /* Importante para manter visivel a imagem da 'seta' */
	text-decoration:none;
}
#menu li:hover a {
	color:#161616;
}
#menu li .drop {
	padding-right:21px;
	background:url("images/drop.png") no-repeat right 20px;
}
#menu li .columns {
	position:absolute; /* Importante para posicionar o conteúdo do dropdown */
	left:-9999px; /* Esconde o dropdown quando o mouse não está em cima do link */
	padding:10px 4px 10px 20px;
	border-top:none;
	background:#F4F4F4;
	width: 500px;
}
#menu li:hover .columns{
	left:0;
}
#menu ul li {
	line-height:21px;
	font-size:12px;
}
#menu li ul.col{
	display:inline;
	float: left;
	position: relative;
	padding:0;
	margin:0 0 12px 0;
	width:33.33%;
}
#menu li ul.col li {
	margin:0 0 10px 0;
	padding:2px 6px;
	width:85%;
	border-bottom:1px solid #fff;
	list-style-type:none;
	font-size:12px;
	height:100%;
	position:relative;
	float:none;
}
#menu li .col li:hover {
	padding:2px 6px;
	margin:0 0 10px 0;
	border-bottom:1px solid #aaa;
}
#menu li .col span{
	font-size:12px;
	color:#333;
	font-weight:bold;
}
#menu li .col li a{
	font-size:12px;
	color:#aaa;
}
#menu li .col li a:hover{color:#333;}

No CSS destaco o position, em #menu li que tem que ser relativo e #menu li .columns que tem que ser absoluto, isso é para manter um posicionamento correto do box do dropdown e o mais importante é o left:-9999px; dentro também de #menu li .columns, que esconde o box do dropdown quando não está sendo acionado.

O menu foi testados nos seguintes navegadores:

IE7+, Firefox (Windows), Chrome (Windows), Safari (Windows)

Você pode ver um exemplo aqui

Faça o download dos arquivos no link abaixo:

[CSSBUTTON target="http://www.marcelotorresweb.com/downloads/Menu-DropDown-com-colunas-em-CSS.zip" color="1982D1" textcolor="ffffff" newwindow="true"]Menu DropDown com colunas em CSS[/CSSBUTTON]