Bueno esto es un tutorial basicamente basado http://vagabundia.blogspot.com/2011/09/p...n-css.html
Que esta editado por mi

1) Copiamos nuestro HTML para donde queramos usarlo basicamente se usa "cabecera" del foro que se encuentra en plantillas, en el resultado yo edite el "header_welcomeblock_member"
ESTE SERIA EL DEFAULT COMO VIENE

<input type="checkbox" id="popup" class="popUpControl">
<label class="elboton" for="popup">
  <span class="click">mostrar</span>
  <span class="hiddenbox">
    ACA PONEMOS LO QUE QUERAMOS TENER DENTRO DEL POP UP
  </span>
</label>

OPCIONAL:: ESTE SERIA COMO LO TENGO YO, YA EDITADO

<input type="checkbox" id="popup" class="popUpControl">
<label class="elboton" for="popup">
<span class="click">Mi Pop Up</span>
  <span class="hiddenbox">
  <span><a href="{$mybb->settings['bburl']}/usercp.php" class="usercp">Configuracion</a><br />
  <span><a href="{$mybb->settings['bburl']}/usercp.php?action=avatar" class="avatar">Editar Avatar</a><br />
  <span><a href="{$mybb->settings['bburl']}/usercp.php?action=editsig" class="firma">Editar Firma</a><br />
  <span><a href="{$mybb->settings['bburl']}/member.php?action=profile&uid={$mybb->user['uid']}" class="perfil";/><b>Ver Perfil</b></a><br />
  <span><a href="{$mybb->settings['bburl']}/member.php?action=logout&amp;logoutkey={$mybb->user['logoutkey']}" class="logout">{$lang->welcome_logout}</a>
</span>
</label>

2) Y LUEGO NUESTRO CSS, QUE ESTA EDITADO POR MI ESTE ;P

 /* la etiqueta LABEL */
  .elboton {
    background-color: transparent;
    border-radius: 5px;
    color: #026CB1;
    cursor: pointer;
    display: inline-block;
    font-size: 10px;
    margin: 0;
    padding: 5px 5px;
    position: relative;
    top: 0px;
    font-weight: bold;
  }
 /* el contenedor con lo lo que queremos mostrar */
  .hiddenbox {
    background-color: #FFF;
    border-radius: 5px;
    left: -70px;
    line-height: 30px;
    margin: 0;
    opacity: 0;
    position: absolute;
    text-align: center;
    top: 120%;
    z-index: 100;
    width: 170px;
    border: 1px solid #cecece;
    border-top: 3px solid #cecece;
    font-weight: bold; 
    -moz-transition: all 1s;
    -webkit-transition: all 1s;
    -o-transition: all 1s;
    -ms-transition: all 1s;
  }
  /* se muestra el contenido oculto */
  .popUpControl:checked ~ label > .hiddenbox {
    opacity: 1;
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
  }
  /* el CHECKBOX lo mantenemos siempre oculto */
  .popUpControl {display: none;}

3) RESULTADO
[Imagen: 19kgbpR.jpg]


Aclaro que pude hacer el Pop Up asi pero no logro hacer que se escondan las URL es decir el Pop Up esta oculto pero al pasar el mouse por donde estaria el Pop Up las url se pueden hacer click.