Showing your Blogger Labels as Vertical Tabs

Following are the instructions on how to install:


1. Follow the instructions from the original Tab hack.

2.Add this code to the end of the CSS part, before the ] ] > sign:, change the CSS menu name from menu1 to menux (x varies from 1 to 14 [designs].)

#menu1 li{
margin:0;
padding:0 0 .25em 0;
text-indent:0px;
line-height:1.5em;
}

3. Add the right CSS code next. I include the first one here, you can go to the demo site to grab the one you like the most


#menu1 {
width: 200px;
margin: 10px;
border-style: solid solid none solid;
border-color: #3D261D;
border-size: 1px;
border-width: 1px;
}

#menu1 li a {
height: 32px;
voice-family: "\"}\"";
voice-family: inherit;
height: 24px;
text-decoration: none;
}

#menu1 li a:link, #menu1 li a:visited {
color: #E4D6CD;
display: block;
background: url(http://photos1.blogger.com/blogger2/3729/970792021505273/1600/menu1.gif);
padding: 8px 0 0 10px;
}

#menu1 li a:hover {
color: #FFF;
background: url(http://photos1.blogger.com/blogger2/3729/970792021505273/1600/menu1.gif) 0 -32px;
padding: 8px 0 0 10px;
}


4. Finally, change the div inside your widget to say "menu1" instead of "tabsF" like instructed in the original article. Keep the widget at the sidebar, and you should be able to see your vertical tabs.

There are some Demo from the csspicstock.blogspot.com...