'Active' tab php not working after converting tab menu to dropdown

Our website has a tab menu featuring categories (tabs) of products (menu). When the user clicks on a product in the menu, it goes to a detail page. This page has the same tab menu and shows the same category tab as active. Webassist created this functionality in premiere support.

The tab menu has now been converted into a dropdown but the tabs don't activate like the original tab menu. The menu drops down on click, and redirects to a detail page when a product is selected. The new dropdown has a 'list-item' class in the list tags which the original didn't have, but without it, the dropdowns don't work. Also, the dropdown-toggle has a 'dropdown' attribute rather than a 'tab' attribute, but don't know if this is problematic.

Don't know if all this is just a css fix, or if the php activeTab code webassist created needs to be tweaked for the dropdown.

Can I see a url where you have this implemented? That would help me to see what is going on.

The link is in the private message. The only issue is getting the active tab to display red rather than white.

It looks like we added code that added class="active" to the current tab in the old menu system. You could probably copy that logic for your new navigation and then define a new class like:

.navbar-nav > li.active > a:link {
    background-color: #e32019;
    color: #ffffff;
}

That could could be adjusted to be whatever styles you want on the active tab.

The active link works but nothing I've tried will change the active link background color.

Do you have it adding the "active" class to the <li> tag that should be active? Can I see a url where you have tried?

I tracked down the correct css for the tab, but had to change 'data-toggle' from 'dropdown' to 'tab' for it to work as active, which removes the dropdown functionality.

You can view with the url in PM (only first two tabs have been changed).

You shouldn't have to make that change from 'dropdown' to 'tab'. It appears that is not the correct approach and shouldn't be necessary. If you can get the new page to add a class, then you shouldn't have to remove or change any existing classes and should be able to style the resulting page with the added class reference.

I've tried every combination of css and :active I can think of, but nothing will change the active white tabs to red. I've eliminated all css styles except the dropdown, thinking there was a css style overriding. Tried revising the original tab menu, and adding back in the dropdown classes, etc., but the red goes away every time. I can make all tabs red, and the hover works, but not active. The only way I've gotten the tabs to work properly as 'active' is to remove the dropdown feature.

How can I reproduce what you have done? I don't see the active class being added when I navigate currently. What pages should I navigate and steps should I follow to reproduce the problem so I can suggest the proper CSS?