This is a migrated thread and some comments may be shown as answers.

Change the colour of the selected tab and the font

1 Answer 840 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
Ali
Top achievements
Rank 1
Ali asked on 25 Jul 2012, 08:54 PM
Hello,

I was wondering how I would go about changing the background color of the selected tab (not the contents of the tab, the tab heading itself, when I hover over it it turns grey but then goes back to normal once I click the tab, I want it to stay grey). I was also wondering how to change the font and font color of the tab heading once selected.

Please let me know if you need any other information, I'm not really sure how much more specific I can get without taking screenshots but I will if needed.

1 Answer, 1 is accepted

Sort by
0
Clint
Top achievements
Rank 1
answered on 31 Jul 2012, 08:54 PM
This is your hovered styling........
div#tabs li.k-item.k-state-default.k-state-hover {
   background-color:grey !important;
}

This is your selected state......
div#tabs li.k-item.k-state-default.k-tab-on-top.k-state-active {
    background-color:grey !important;
}

This would be the base for your tab styling.......... just in case you need it
div#tabs li.k-item.k-state-default {
    background-color:#f0713a;
    color: white !important;
   height: 55px;
   width: 100px;
   margin-right: 5px;
   background-image: none !important;
}

Keep in mind that I have    "div#tabs" in the beginning, so you would need to change that depending on your selector and ID.
Tags
TabStrip
Asked by
Ali
Top achievements
Rank 1
Answers by
Clint
Top achievements
Rank 1
Share this question
or