tough time battling css. can't get background-color below background image

Question

I've been doing lot of trial and error but now need some help.

Page I'm working on: link

Questions:

Sliding tab content: When I hover the mouse over the three tabs, the div that moves along with the mouse is not getting evenly balanced between the three tab contents. There is a plugin that I used, tabbedcontentslider. I think it is changing the div based on some formula.

Can someone point me in right direction?

Answer 1

I had a quick fiddle with the css and have something which seems to work in Firefox. I think the most important thing is getting the 2 widths the same, and centrally positioning the background image to allow a span of almost double the width.

CSS changes:

.tabs .moving_bg {
    background-position: center bottom ;
    background-repeat: repeat-x ;
    width: 175px ;
}

.tabs .tab_item {
    width: 175px ;
}