[Tutorial]Gadget flotante & Deslizante con Nombre

Holaaaaaya solo quedan cuatro semanas para que se acabe el curso & llege el veranopodre publicar todos los días o mas que todos los días cuando me apetezca sea lunes, martes ctepero antes tengo que esforzarme en aprobar todo & ya estaré libredejando esto aun lado vengo con un tutorial que me han pedidoy es de como poner la pestaña que tengo yo ahora mismo donde pone MENU!

• Hacer todo lo que dice en este tutorial y cuando vayais a colocar el codigo que pone colocais este e su lugar
• Antes de ]]></b:skin>

#HTML12 h2 {
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
padding: 5px;
width: 150px;
border-radius: 0 0 10px 10px;
left: -60px; top:30px;
position:absolute;
}
#HTML12 {
position: fixed;
top: 70px;
right: -220px;
width: 200px;
background: #fff; /* FONDO */
padding: 7px;
border-radius: 26px; /* BORDES REDONDEADOS */
opacity: 0.80;
border-left: 10px solid #89ebe8; /* BORDE VIOLETA */
-webkit-transition: all .5s
}
#HTML12:hover {
right: 0px;
opacity: 1;
-webkit-transition: all .5s;
}

 Acordaos que este code es el code de tu gadget que puede ser cualquiera (este code varia no os olvidéis de ponerlo bien sin fallos porque da error)

Espero que os haya gustado el tuto ha sido muy rápido ya que tenia hecho una parte & me ahorraba explicar el proceso x3 ya sabéis que si tenéis alguna duda me lo decís, antes de irme quiero anunciar que pronto haré un concurso para celebrar el empiece del verano :3 un beso & buen fin de semana