Just an update for light and lucid tabs, my dev site I have so far done this:
EXAMPLE:
http://forum.x-cart.com/attachment.php?attachmentid=1811&stc=1&d=126352523 6
I Have used 2 images:
tab_l.png (10x25) There original was 600x25 - And tab_r.png (10x25) Same size as orig
CODE And BOLDED IS WHAT'S ADDED TO BRING INLINE WITH MY TABS
.tabs {
position: absolute;
top: 0px;
right: 0px;
margin: 0px;
padding: 0px;
height: 25px;
width: 80%;
text-align: right;
}
.tabs ul {
margin: 0px;
padding: 0px;
list-style: none;
}
.tabs li {
float: right;
margin: 0px 1px 0px 0px;
padding: 0px;
background: transparent url(images/tab_r.png) no-repeat right top ;
background-color:#d8e7f3;
height: 25px;
}
.tabs a:link,
.tabs a:visited,
.tabs a:hover,
.tabs a:active
{
display: block;
background: transparent url(images/tab_l.png) no-repeat left top;
margin: 0px 5px 0px 0px;
padding: 5px 10px 5px 15px;
text-align: center;
vertical-align: middle;
white-space: nowrap;
color: #253161;
text-decoration: none;
font-weight: bold;
font-size: 11px;
height: 25px;
outline-style: none;
}
.tabs a:hover {
color: #2863c2;
}
Of course this is nothing fancy, if I wanted a nice border I would have to redo css, I'm not sure if this helps original poster, but you could use that code on what ever template your using, but check code, and of course you have to create the tabs like I redone.
You could also use inline css within skin1/customer/tabs.tpl