Change the color of tabs

Support
#1

Hi, give the code how to change the font color of the tabs Not only the font but also the color of the tab pro
вкладки

#2

Hi There,

Thank you for writing in. First please add a class to your Tabs element.

screenshot

This way you can style your tabs without affecting the other tabs on your site/page.

Then have that class on your selector to formulate a custom CSS that target that tabs. Your selector would be:

.myclass>li>a {
	color: value;
    background-color: value;
}

The css property that you need is the color and the background-color.

Hope it helps,
Cheers!

#3

Hi, I do not understand - you can naisat code?

#4

.myclass>li>a {
color: #000;
background-color: #ddd; Это не работает

#5

.x-nav-tabs > .active > a, .x-nav-tabs > .active > a:hover {
color: #000;
background-color: #efefef;
}

.x-nav-tabs>li>a {
color: #000;
background-color: #ddd;
}

This also does not work, could you help more easily, write a work code to me. Thank you very much.

https://vip-m-stroi.ru/primeryi-natyazhnyih-potolkov-nashi-rabotyi

#6

Hi There,

You almost got the correct CSS code.

.myclass>li>a {
	color: red;
	background-color: blue;
}

It did not work because 1) There is a syntax error on your custom CSS.

.x-bbp-item-info-header .bbp-admin-links a {
    display: block;
    border-right: 1px solid #181919;
    border-bottom: 1px solid #151515;
    padding: 10px 15px;
    line-height: 1;
    color: rgba(255,255,255,0.1);
    background-color: #2f3a3c;
    box-shadow: inset -1px -1px rgba(255,255,255,0.025);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 20%;
    float: left;

Add a closing bracket “}” to that block.

  1. You did not add a class myclass to your Tab element

Thanks,

#7

.x-nav-tabs > .active > a, .x-nav-tabs > .active > a:hover {
color: #000;
background-color: #efefef;
}

.x-nav-tabs>li>a {
color: #000;
background-color: #ddd;

Thanks, does not work - I’m trying this one.

#8

Hi There,

First your site is under caching, please clear and deactivate all your site’s caching plugins and feature while you’re still developing it if you wish to see the changes immediately.

Second review your entire custom CSS here (http://csslint.net/) and resolve all the found errors. Not all CSS will work even if they are correct if you have a syntax error there.

Then after that, re-read my first reply.

Have a nice weekend,
Cheers!