Jean, If your not to bovvered about perfect rounded affects on Hover how about this:
http://forum.x-cart.com/attachment.php?attachmentid=1812&stc=1&d=126356276 2
The Shopping Cart Link in pic, shows the mouse over:
CSS:
/* header tabs abeez_skyblue_topnav */
.abeez_skyblue_topnav{
position: absolute;
top: 0px;
right: 0px;
margin: 0px;
padding : 0px;
height: 25px;
width: 100%;
text-align: right;
}
.abeez_skyblue_topnav ul{
margin: 0;
padding: 0;
float: left;
width: 100%;
font: bold 13px Arial;
background: #242c54 url(abeez_sources/sky_blue/images/bg_green_top.png) center center repeat-x; /*default background of menu bar*/
}
.abeez_skyblue_topnav ul li{
display: inline;
}
.abeez_skyblue_topnav ul li a{
float: left;
color: white;
padding: 9px 11px;
text-decoration: none;
}
.abeez_skyblue_topnav ul li a:visited{
color: white;
}
.abeez_skyblue_topnav ul li a:hover, .abeez_skyblue_topnav ul li .current{ /*background of main menu bar links onMouseover*/
color: white;
background: transparent url(abeez_sources/sky_blue/images/bg_hover_top.png) center center repeat-x;
}
And edited
skin1/customer/head.tpl
And put this in first part of head.tpl: (But mine is custom design) the important thing if anyone needed was the css for straightforward tabs.
<div class="line2">{include file="customer/tabs.tpl"}</div>
And of course using 2 very simple images,