Basic Skin Navigation Buttons

I am using the Basic skin on the FREE Community Licence and am trying to adapt the look and feel.

Basically the navigation buttons on the top right, the coloured ones, I would like to make some more fancier designed ones, but on making some and replacing they look a bit naff as they resize, and are just a little clunky.

Can anyone explain how to code in some neat buttons that can replace the ones that are there already?

Thanks in advance

PS, the site is if you need to take a glimpse at the site!


Given your example, you need to work out the styling of your buttons. Also, you will need “left” and “right” graphic images for the left/right edges that utilize the same color as the background color you are using.

If you look at what was there before you made changes, you will see “how” they are constructed. If you want something different then you should follow the same basic model and adjust graphics/colors to suit your need or contact a good web developer familiar with cs-cart to help you. Cscart Rocks or Brandon V would be good choices.

Thanks for the reply, I have managed to make the 'new' buttons, but on changing them to be a new size, they revert back to the original size ie 200 x 32 pixels etc, thats the part I'm quite confused about really?

What does firebug tell you about the css that is defining the properties of the tabs?

This is how it looks via Firebug…

Screen shot 2011-08-03 at 23.07.49.png

I guess my point was that firebug will tell you why it looks so funky.

It doesn't appear that your background images have loaded, but since I don't know what they look like, I really have no idea.

Use firebug's NET tab and then look at 'images' to see that your images are loading. Remember, that images for background are relative to the css file, not to anything else.

Thanks for the replies, I've bailed out and made the buttons white, not being a savvy coder, this is all above me, but now simplified the nav buttons which seem to work okay… cheating I know, but sometimes its easier!

Thanks again.