pada Tutorial blog Sebalumnya Blog PASUT^27 Menjelaskan tentang Cara membuat link mengeluarkan bintang saat mouse menyorot link dan kali ini saya ingin menjelaskan tentang Cara Membuat Menu Drop Down Horizontal Melayang Di Blog.

Baiklah Saya Akan Langsung Memulai Langkah-langkahnya:

Login Ke Akun Blog Sobat
Pilih Rancangan -->Tambah Gadget Dan Pilih HTML Java Script
Dan Copy Paste Kode Berikut Tepat Didalamnya

<style type="text/css">
#warief ul li a {position: relative;float: bottom;display: block;width: AUTO;height: 15px;padding: 5px 0 0 0;margin-right: 5px;text-align: center;font-size: 15px;text-decoration: none;color:transparant;font-weight: bold;outline: none;}#warief li .current{color: transparant;}#warief li a:hover, #warief li a:active {background: #4B0082;background: -webkit-gradient(linear, left top, left bottom, from(#4B0082), to(#FF0000)); background: -moz-linear-gradient(top,#4B0082, #FF0000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4B0082', endColorstr='#FF0000'); -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4B0082', endColorstr='#FF0000'); display: inline-block;zoom: 1; *display: inline;border: dotted 1px #555555;padding: 3px 5px;-webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: 0 1px 0px rgba(1,0,0,.1); -moz-box-shadow: 0 1px 0px rgba(0,0,0,.1); box-shadow: 0 1px 0px rgba(0,0,0,.1); -webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out; -webkit-transform:rotate(10deg);-moz-transform:rotate(10deg);-o-transform:rotate(10deg);}color: #ffffff;margin: 0;font-size:18px;padding: 9px 15px 8px;text-decoration: none;}#warief {width: auto;float: left;margin: 0;padding: 0;}#warief {margin: 0;padding: 0;}#warief ul {float: left;list-style: none;margin: 0;padding: 0;}#warief li {list-style: none;margin: 0;padding: 0;}#warief li a, #warief li a:link, #warief li a:visited {color: #ffffff;display: block;text-transform: capitalize;margin: 0;padding: 9px 15px 8px;font: Bold 15px Georgia, Arial;}#warief li a:hover, #warief li a:active {background:transparant;color: #ffffff;margin: 0;font-size:20px;padding: 9px 15px 8px;text-decoration: none;}#warief li li a, #warief li li a:link, #warief li li a:visited {background: #00FFFF;background: -webkit-gradient(linear, left top, left bottom, from(#00FFFF), to(#000000)); background: -moz-linear-gradient(top,#00FFFF, #000000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00FFFF', endColorstr='#000000'); -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00FFFF', endColorstr='#000000'); width: 250px;color: #E6E6FA;-webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; border-style: outset;-webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out; -webkit-transform:rotate(10deg);-moz-transform:rotate(10deg);-o-transform:rotate(10deg);float: none;margin: 0;padding: 7px 10px;border-bottom: transparant;border-left: transparant;border-right: transparant;font: bold 14px kristen itc, Arial;}#warief li li a:hover, #warief li li a:active {background: #FF0000;background: -webkit-gradient(linear, left top, left bottom, from(#FF0000), to(#00FF00)); background: -moz-linear-gradient(top,#FF0000, #00FF00); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0000', endColorstr='#00FF00'); -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0000', endColorstr='#00FF00'); color: #ffffff;font-size:20px;font-family:kristen itc;text-align: center;padding: 7px 10px;}#warief li {float: left;padding: 0;}#warief li ul {z-index: 9999;position: absolute;left: -999em;height: 20px;width: 170px;margin: 0;padding: 0;}#warief li ul a {width: 140px;}#warief li ul ul {margin: -32px 0 0 171px;}#warief li:hover ul ul, #warief li:hover ul ul ul, #warief li.sfhover ul ul, #warief li.sfhover ul ul ul {left: -999em;}#warief li:hover ul, #warief li li:hover ul, #warief li li li:hover ul, #warief li.sfhover ul, #warief li li.sfhover ul, #warief li li li.sfhover ul {left: auto;}#warief li:hover, #warief li.sfhover {position: static;}#footer-column-divide {clear:both;}#warief{font-family:Comic Sans Ms;background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYHESqixqWiph1oOXqfdCpvYFudtebuS92qAPxjyUbabpbc7WhYIBJVb0stcbGhk7IxxU8fAas6ZOxJFwAtbRo0_HCkgbI6x30LGeUVdmsarlPcSm9UC0NA0FS4nFaI4jqe-z8FPfjhtZd/)repeat-x;(0,0,0, 0.80);border:1px solid #C0C0C0;padding:2px 0;z-index:999;top:0px;left:1px;right:1px;position:fixed;-moz-border-radius:10px;-webkit-border-radius:10px;}
</style>

<div id='warief'>
<ul id='warief'>
<li><a href='Disini letak link sobat'>Home</a></li>
<li><a href='Disini letak link sobat' target='_blank'>Daftar Isi</a></li>
<li><a href='http://pasut27.blogspot.com/' target='_blank'>Download</a>
<ul class='children'>
<li><a href='Disini letak link sobat' target='_blank'>Download Aplikasi</a></li>
<li><a href='Disini letak link sobat' target='_blank'>Download Game</a></li>
<li><a href='Disini letak link sobat' target='_blank'>Download Icon</a></li>
<li><a href='Disini letak link sobat' target='_blank'>Download MP3</a></li>
<li><a href='Disini letak link sobat' target='_blank'>Download Software</a></li>
<li><a href='Disini letak link sobat' target='_blank'>Download Template</a></li>
</ul>
</li>
<li><a href='http://pasut27.blogspot.com/' target='_blank'>Edit</a>
<ul class='children'>
<li><a href='Disini letak link sobat' target='_blank'>Edit1</a></li>
<li><a href='Disini letak link sobat' target='_blank'>Edit2</a></li>
<li><a href='Disini letak link sobat' target='_blank'>Edit3</a></li>
</ul>
</li>
<li><a href='Disini letak link sobat' target='_blank'>Tips And Triks</a>
<ul class='children'>
<li><a href='Disini letak link sobat' target='_blank'>Tips Blogger</a></li>
<li><a href='Disini letak link sobat' target='_blank'>Trik Facebook</a></li>
<li><a href='Disini letak link sobat' target='_blank'>Trik Handpone</a></li>
<li><a href='Disini letak link sobat' target='_blank'>Pernak-pernik Blog</a></li>
</ul>
</li>
<li><a href='http://pasut27.blogspot.com/'>Tutorial</a>
<ul class='children' target='_blank'>
<li><a href='Disini letak link sobat' target='_blank'>Tutorial Blog</a></li>
<li><a href='Disini letak link sobat' target='_blank'>Tutorial SEO</a></li>
</ul>
</li>
<li><a href='Disini letak link sobat' title='tv online' target='_blank'>Tv Online</a>
<ul class='children'>
<li><a href='Disini letak link sobat'>Antv</a></li>
<li><a href='Disini letak link sobat' target='_blank'>Tv One</a></li>
</ul>
</li>
<li><a href='Disini letak link sobat' target='_blank'><blink>Tukar Link</blink></a></li>
<li><a href='http://pasut27.blogspot.com' title='PASUT^27' target='_blank'><blink>PASUT^27</blink></a></li>
</ul>
</div>