Format Classic Tabs Border

[riugn557]

Hi there,

I have a class tabs element on this page https://thelanguagesherpa.com/russianpod101-review/

Do you know how I can change the thickness of its border and change the color of this border?

Thank you!
LS

[nabeel]

Hey there,

Thanks for writing in! Try adding the following CSS code in the Theme Options > CSS:

.x-nav-tabs.left>.x-nav-tabs-item, .x-nav-tabs.right>.x-nav-tabs-item, .x-nav-tabs.left>li a, .x-nav-tabs.left {
    border-width: 2px !important;
    border-color: #cac7c7 !important;
}

Let us know how this goes!

[riugn557]

Hi Nabeel,

That’s great, thank you.

Can I also have it so that the border format changes affect all the borders around the content as well as the borders around the tabs?

Also, do you know how I can change the colour of the text in the tabs that have not been chosen?

Thank you!
LS

[ruenel]

Hello There,

You can update the given css and use this instead:

.x-nav-tabs.left>.x-nav-tabs-item, 
.x-nav-tabs.right>.x-nav-tabs-item, 
.x-nav-tabs.left>li a, 
.x-nav-tabs.left,
.x-tab-content {
    border-width: 2px !important;
    border-color: red !important;
}

.x-nav-tabs.left .x-nav-tabs-item a {
    color: green;
}

.x-nav-tabs.left .x-nav-tabs-item.active a {
    color: red;
}

The green color is for the tab item colors and the red text color is when the tab item is active.
I used distinct colors to easily identify the changes in your site. You may need to change the colors according to your preference.

Hope this helps.