Sayyadi Berkreasi

<style type="text/css" media="screen">
.pd_menu_01 {float:left; padding:0; margin:0;color: #FFFFFF;background: #294BD6;width:100%; border:solid 1px #FF0000;clear:both;} /*Color navigation bar normal mode*/
.pd_menu_01  a, .pd_menu_01 a:visited {
font-family:Arial, Helvetica, sans-serif;
font-style:normal;
font-weight:bold;
font-size:12px;
color: #FFFFFF;
background-color: #294BD6;
text-decoration: none;
}
.pd_menu_01 ul {list-style-type:none;padding:0; margin:0;}
.pd_menu_01 ul li {float:left; position:relative; z-index:auto !important /*Non-IE6*/; z-index:1000 /*IE6*/; border-right:solid 1px #FF0000; }
.pd_menu_01 ul li a {color: #FFFFFF;background: #294BD6;float:none !important /*Non-IE6*/; float:left /*IE-6*/; display:block; height:30px; line-height:30px; padding:0 10px 0 10px; text-decoration:none; }
.pd_menu_01 ul li ul {display:none; border:none;color: #FFFFFF;background: #294BD6;}
.pd_menu_01 ul li:hover a {background-color:#FF0000; text-decoration:none; color:#FFFF00;} /*Color main cells hovering mode*/
.pd_menu_01 ul li:hover ul {display:block;  position:absolute; z-index:999; top:29px; margin-top:1px; left:0;}
.pd_menu_01 ul li:hover ul li a {display:block; width:12em; height:auto; line-height:1.3em; margin-left:-1px; padding:5px 10px 5px 10px; border-left:solid 1px #FF0000; border-bottom: solid 1px #FF0000; background-color:#00FF40;  color:#0000E1;} /*Color subcells normal mode*/
.pd_menu_01 ul li:hover ul li a:hover {background-color:#FF8040; text-decoration:none;color:#0000FF;} /*Color subcells hovering mode*/
.pd_menu_01 table {position:absolute; top:0; left:0; border-collapse:collapse;color: #FFFFFF;background: #294BD6;}
.pd_menu_01 ul li a:hover {background-color:#FF0000; text-decoration:none;color:#FFFF00;} /*Color main cells hovering mode*/
.pd_menu_01 ul li a:hover ul {display:block; width:12em; position:absolute; z-index:999; top:29px; left:0; }
.pd_menu_01 ul li a:hover ul li a {display:block; width:12em; height:1px; line-height:1.3em; padding:4px 16px 4px 16px; border-left:solid 1px #FF0000; border-bottom: solid 1px #FF0000; background-color:#00FF40;  color:#0000E1;} /*Color subcells normal mode*/
.pd_menu_01 ul li a:hover ul li a:hover {background-color:#FF8040; text-decoration:none;color:#0000FF;} /*Color subcells hovering mode*/
</style>







head





<div class="pd_menu_01 ">
<ul><li><a href="/">Home<!--[if IE 7]><!--></a><!--<![endif]--><!--[if IE]><table><tr><td><![endif]-->
<!--[if IE]></td></tr></table></a><![endif]--></li></ul>
<ul><li><a href="">Download<!--[if IE 7]><!--></a><!--<![endif]--><!--[if IE]><table><tr><td><![endif]-->
<ul>
<li><a href=""  >7ui</a></li>
<li><a href=""  class="lastone">[new sub-menu item]</a></li>
</ul>
<!--[if IE]></td></tr></table></a><![endif]--></li></ul>
<ul><li><a href="">Profile ku<!--[if IE 7]><!--></a><!--<![endif]--><!--[if IE]><table><tr><td><![endif]-->
<ul>
<li><a href=""  class="lastone">aku</a></li>
</ul>
<!--[if IE]></td></tr></table></a><![endif]--></li></ul>
<ul><li><a href="">PKL 2012<!--[if IE 7]><!--></a><!--<![endif]--><!--[if IE]><table><tr><td><![endif]-->
<ul>
<li><a href=""  >miggu 1</a></li>
<li><a href=""  class="lastone">minggu ke 2</a></li>
</ul>
<!--[if IE]></td></tr></table></a><![endif]--></li></ul>
<ul><li><a href="">Menu<!--[if IE 7]><!--></a><!--<![endif]--><!--[if IE]><table><tr><td><![endif]-->
<ul>
<li><a href=""  >Menu1</a></li>
<li><a href=""  class="lastone">menu2</a></li>
</ul>
<!--[if IE]></td></tr></table></a><![endif]--></li></ul>
<ul><li><a href="">Menu1<!--[if IE 7]><!--></a><!--<![endif]--><!--[if IE]><table><tr><td><![endif]-->
<ul>
<li><a href=""  >Menu1</a></li>
<li><a href=""  class="lastone">menu2</a></li>
</ul>
<!--[if IE]></td></tr></table></a><![endif]--></li></ul>
<ul><li><a href="">Menu2<!--[if IE 7]><!--></a><!--<![endif]--><!--[if IE]><table><tr><td><![endif]-->
<ul>
<li><a href=""  >menu 1</a></li>
<li><a href=""  class="lastone">menu2</a></li>
</ul>
<!--[if IE]></td></tr></table></a><![endif]--></li></ul>
<ul><li><a href="">Menu3<!--[if IE 7]><!--></a><!--<![endif]--><!--[if IE]><table><tr><td><![endif]-->
<ul>
<li><a href=""  >menu1</a></li>
<li><a href=""  class="lastone">menu2</a></li>
</ul>
<!--[if IE]></td></tr></table></a><![endif]--></li></ul>
<ul><li><a href="">menu4<!--[if IE 7]><!--></a><!--<![endif]--><!--[if IE]><table><tr><td><![endif]-->
<ul>
<li><a href=""  >menu1</a></li>
<li><a href=""  class="lastone">menu2</a></li>
</ul>
<!--[if IE]></td></tr></table></a><![endif]--></li></ul>
<ul><li><a href="">menu5<!--[if IE 7]><!--></a><!--<![endif]--><!--[if IE]><table><tr><td><![endif]-->
<ul>
<li><a href=""  >menu1</a></li>
<li><a href=""  >menu2</a></li>
<li><a href=""  class="lastone">aku2</a></li>
</ul>
<!--[if IE]></td></tr></table></a><![endif]--></li></ul>
</div>

Posted in: Website tutorial