◄ Min  Size Fonts: + | - | ± Color: Max ►

Make Mejur Menu di Juru

Sudah terlalu banyak postingan bercerita mengenai menu Tapi apa mau dikata, tema untuk dijadikan artikel saat ini ya tentang menu lagi :d Koben mau berbagi cara membuat menu dengan keberadaan posisi di pojok kiri atas. Travelling menu:Yuk kita mulai acara pembuatan mejur (menu juru/pojokan) Megir juga bisa memeiliki arti yg sama dengan mejur, menu gigir (pinggiran) :))
#megir {
  background-color: #F5F5F5;
  border-bottom: 1px solid #8F8F8F;
  text-align: center;
}
#megir a {
  color: #8F8F8F;
  display: block;
  padding: 2px 0;
  margin-right: 1.5em;
}
#megir a:hover {
 color: #d00; 
}
#megir:hover {
  color: #d00;
  height: 125px;
}
#megir {
  position: absolute;
  top: -5px;
  left: -87px;
  width: 355px;
  height: 30px;
  overflow: hidden;
  padding-top: 2.7em;
  -webkit-transform-origin: 0 0;
  -moz-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  -o-transform-origin: 0 0;
  transform-origin: 0 0;
  -webkit-transform: rotate(-35deg) translate(-90px, 25px);
  -moz-transform: rotate(-35deg) translate(-90px, 25px);
  -ms-transform: rotate(-35deg) translate(-90px, 25px);
  -o-transform: rotate(-35deg) translate(-90px, 25px);
  transform: rotate(-35deg) translate(-90px, 25px);
}
MarkUp HTML<div id="megir">
<a href="" title="">You Title</a>
<a href="" title="">You Title</a>
<a href="" title="">You Title</a>
<a href="" title="">You Title</a>
<a href="" title="">You Title</a>
</div>
Width pada ramuan CSS sangat berpengaruh pada jumlah menu yg akan dipasangkan (markup html) Oleh karena itu tentukan dulu mau pasang berapa menu, bare deh atur² variabel CSS ;)
Ide pembuatan menu mejur diperoleh dari Learn CSS Layout Kunjungi web tersebut biar sobat menjadi master CSS layout :)
Happy coding \m/
Loading...
XMake Mejur Menu di Juru
Membuat menu dengan posisi di pojok kiri atas, mejur is funky abis
Subscribe my posts Register For Free!
[?] g+ convert

DO NOT EVEN TRY ADD LINK [-X
You can use some HTML tags, such as
<b> - <i> - <a> - http://...jpg/gif/png/bmp - http://youtu.be/...

al-Quran

MISC

Resources

WANT BE HERE!!! CONTACT ME :P
1 2 3 4 5 6 7 8 9

FACEBOOK PAGE