Some Little from me for You

Jika sobat kepengen memiliki menu navigasi dengan konten link-link berjejer sangkin banyaknya, maka lihatlah postingan AA yang berjudul improve skill css anymore with css1k. Berpuluh-puluh demontrasi bisa kalian lihat hanya dengan ukuran CSS file sebesar 1K! Tinggal sedikit sentuhan kreatifitas agar sreg ditanamkan ke dalam blog tercinta :x Kode CSS sedikit, namun mark-up HTML lumayan :D Jadi kita bisa menyebutnya menu reuteung ala CSS1K. Berikut contoh menu-reuteung (edit dikit sana-sini) jsfiddle.net/bebenkoben/gEBrX/show Web jsFiddle dashboardnya diperbaharui ;)) Links resource keren punya sebenarnya sudah banyak tersedia! Tinggal urusan mendapatkannya, cocok apa tidak, mudah apa sulit dan faktor X lainnya ;)

Berikut beberapa links source pilihan

cdpn.io/izswy, cdpn.io/AepGb, cdpn.io/xzjGB, cdpn.io/xgqtc, cdpn.io/KJkEs, cssdeck.com/labs/full/ufct35ys5t, cssdeck.com/labs/full/8852y8sb, cdpn.io/Ayaqv, cssdeck.com/labs/full/forms-validation-styling-semantics, bit.ly/1a8NR07, bit.ly/1a8O2si & bit.ly/1a8ObvR

Coba sobat datangi link-link tersebut, pasti bakalan seru. Kalau merasa kurang besok lagi saja. Berikut bonusnya dari AA membuat form search atau kotak pencarian bergaya hover.

#search input[type="text"]:hover {width: 208px;border:1px solid #CCC;}
#search input[type="text"] {
background: #FFF url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEXBpjJxE_uhwX32pBGM5v1fRslvw7fxQrwNbF_rG_qloUdhId4FpF081tLJwcfAxizr7G9e5UeSgsfX9_iC_WrXaSV6Nzl8Vmic0CWBbULOn400wS7orHl54k-xQAbGndWfm58msf-SB4/s0/search_32x32-32.png")no-repeat center left;
font-size: 13px;
color: #222;
width: 0px;
padding: 10px 0px 11px 35px;
z-index: 9;
border: 1px solid #FFF;
-webkit-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
margin-bottom: -1px;
position: fixed;
top: 0px;
right:20px;
}

Markup HTML<form action="http://YOUR-BLOG.blogspot.com/search/" id="search" method="get" target="top">
<input name="q" placeholder="Query here..." size="40" type="text" />
</form>Happy coding :)
Bbn cheers \m/