Wapmaster MWb

Thursday, July 25, 2013

menu arrow menawan css mywapblog

#navigation{
overflow: hidden;
width: 100%;
clear:both;margin: 0 auto;
  padding: 0; margin: 0 6px;
}
#navigation span{ 
float: left;
  margin: 0;
  padding: 0;
  list-style: none;
 margin-left: auto !important;
  margin-right: auto !important;
margin: 0 .5em 0 1em;
font-size: 13px;
}
#navigation a
{
padding: .7em 1em .7em 2em;
  float: left;
  position: relative;
text-decoration: none;
color: #fff; margin-right:4px;
}
#navigation a:hover{
background: #0f53b0;
}
#navigation a:before{
content: "";
position: absolute;
top: 50%;
margin-top: -1.5em;
border-width: 1.5em 0 1.5em 1em;
border-style: solid;
border-color: #1478ff #1478ff #1478ff transparent;
left: -1em; z-index:1;
}

#navigation a:after{
content: "";
position: absolute;
top: 50%;
margin-top: -1.5em;
border-top: 1.5em solid transparent;
border-bottom: 1.5em solid transparent;
border-left: 1em solid #1478ff;
right: -1em; z-index:2;
}

#navigation span:nth-child(3) a, #navigation
span:nth-child(2) a, #navigation
span:nth-child(1) a {
text-align: right; text-transform:
capitalize;  margin-left: 12px;
padding: 4px 4px 8px 8px; background:#1478ff;}

#navigation span:first-child a{
  padding-left: 1em;
}

NOTE :
margin-left: 12px : ini buat mengatur jarak antar menu
sebagai catatan 1em > 12pt > 16px > 100%

Demikian dari itu Tambahan, kritik dan saran dipersilahkan :)

Friday, July 12, 2013

Cara Membuat Efek Sudut Lipatan Kertas Untuk Mywapblog Mobile

Tidak dipungkiri lagi mywapblog telah melahirkan para designer css yang wahid, ini dikarenakan mwb dapat diakses melalui hp, kapan dan dimanapun... berbeda dgn blog lain, sistem yang diterapkan mwb sangat-sangat mudah sehingga siapapun yang baru mengenal tidak membutuhkan waktu lama untuk beradaptasi.

kali ini masih seputar css untuk tampilan hp tentunya, kita terapkan sudut lipatan kertas mwb jadi tidak hanya versi desktop saja mobilepun tak mau ngalah.. dan SUDUT LIPATAN INI TANPA GAMBAR