Tutorial : Navigation Style #12

Assalamualaikum.

Lama dah tak dapat request finally *shed tears* hahaha. Terima kasih sebab request. Atas sebab request anda , berupadate jugak lah blog ni. Navigation kali ni jenis lekat atas tu. Kekalnya ia disitu tidak kira sejauh mana korang scroll blog hingga kebawah sekali pon. Ok lupakan.

LIVE PREVIEW

Code ;

<style>
.navigation a {
font:13pt cambria;
text-decoration:none;
letter-spacing:2.5px;
text-transform:uppercase;
color:black;
padding:0px 30px 0px 30px;
text-shadow:4px 0px transparent, -4px -0px transparent;
-webkit-transition-duration:0.5s;
-moz-transition-duration:0.5s;
-ms-transition-duration:0.5s;
-o-transition-duration:0.5s;
transition-duration:0.5s;
}
.navigation a:hover {
text-shadow:0px 0px #888, -0px 0px #888;
}

</style>
<br />
<div style="left: 0px; padding: 0px; position: fixed; text-align: center; top: 0px; width: 100%; z-index: 999;">
<div class="navigation" style="background:url(http://i.imgur.com/Y2IYZl4.png); border: 1px solid #eee; margin: 0 auto; padding: 15px 0px 20px 0px; width: 1040px;">
<a href="LINK">LINK1</a>
<a href="LINK">LINK2</a>
<a href="LINK">LINK3</a>
<a href="LINK">LINK4</a>
<a href="LINK">LINK5</a>
</div>
</div>

Copy and Paste code diatas di ;

Dashboard > Layout > Add a Gadget > HTML/JavaScript > Save.


Macam biasa, mana code yang di-bold-kan sila ubah mengikut kesusaian blog korang. Sekian.



edited
"for those yang navigation ni bertindih dengan header korang. Sila ke Template >
Edit HTML dan cari code ni body { , dah jumpa sila tambah code : margin-top:110px; bawah code yang dicari tadi. yang warna biru tu, ubah ikut citarasa korang okay"


Bye. o/