Translate

Thursday, May 30, 2013

Create Menu in Blogger


From Layout -> Edit HTML -> check "Expand Widget Templates".

Go th the code code ]]> < / b: skin>

and paste before this following code



/* navbar ================== */
#bg_nav {
 background: #ffffff;
width: 850px;
height: 29px;
font-size: 11px;
font-family: Arial, Tahoma, Verdana;
color: #000000; font-weight: bold;

margin: 0px auto 0px; padding: 0px; border-top: 1px solid #000000; border-bottom: 1px solid #ffffff; overflow: hidden; } #bg_nav a, #bg_nav a:visited { color: #000000; font-size: 11px; text-decoration: none; text-transform: uppercase; padding: 0px 0px 0px 3px; } #bg_nav a:hover { color: #000000; text-decoration: underline; padding: 0px 0px 0px 3px; } #navleft { width: 500px; float: left; margin: 0px; padding: 0px; } #navright { width: 220px; font-size: 11px; float: right; margin: 0px; padding: 3px 5px 0px 0px; } #navright a img { border: none; margin: 0px; padding: 3px 5px 0px 0px; } #nav { margin: 0px; padding: 0px; list-style: none; } #nav ul { margin: 0px; padding: 0px; list-style: none; } #nav a, #nav a:visited { background: #ffffff; color: #000000; display: block; font-weight: bold; margin: 0px; padding: 8px 15px 8px 15px; border-left: 1px solid #ffffff; } #nav a:hover { background: #c06000; color: #000000; margin: 0px; padding: 8px 15px 8px 15px; text-decoration: none; } #nav li { float: left; margin: 0px; padding: 0px; } #nav li li { float: left; margin: 0px; padding: 0px; width: 150px; } #nav li li a, #nav li li a:link, #nav li li a:visited { background: #ffffff; width: 160px; float: none; margin: 0px; padding: 7px 30px 7px 10px; border-bottom: 1px solid #ffffff; border-left: 1px solid #ffffff; border-right: 1px solid #ffffff; } #nav li li a:hover, #nav li li a:active { background: #c06000; padding: 7px 30px 7px 10px; } #nav li ul { position: absolute; width: 10em; left: -999em; } #nav li:hover ul { left: auto; display: block; } #nav li:hover ul, #nav li.sfhover ul { left: auto; }