9 replies to this topic

[charrabennett]

How do I change the colors of the tabber?

http://homeswilliamsburgva.com/wp-content/themes/iRealEstate/images/Screenshot2.png

http://homeswilliamsburgva.com/

[Ronald]

Hi,

the colours are changed (compared to the theme out-of-the-box), so you must have figured this out before. It can be done by editing the jtabber.css file and modifying background images.

A search for change tabber in this forum will also give you some relevant results, such as this one http://ithemes.com/forum/topic/132-how-do-you-change-the-background-color-of-tabber/

Ronald

[charrabennett]

Yes, I know, I added the code in the exact same post you quoted to the bottom of my regular css stylesheet. But there is no white tag in it. ...and I have went through the entire jtabber.css and changed what I thought was the proper tag - didnt work. Then I changed every color code in it that was white (#ffffff) to bright pink (#ff40ff) so I could see if it was truly there that the problem was - and guess what - that didnt work either. SO i checked my regular css code again and still couldnt find it. UGH. Im going to copy both below and hopefully you can see where I screwed up.

[code removed by moderator, we can see all the css code by examining your site. When posting large chunks of code, please use a service like pastebin]

[Ronald]

Hi,

what exactly is the change you want to apply?

Ronald

[charrabennett]

If you look at the tabber that is on the home page directly under the first block of text - the color of the tabs when you mouse over them is white so you can barely read the text. I want to change the background color of the mouseover from white to black. See below screenshot.
http://homeswilliamsburgva.com/Screenshot.png

[Ronald]

Ah,

now I see, you are not referring to the iCompany tabs, but the tabber widget plugin in another location.

I will first move this topic to the appropriate forum: http://ithemes.com/forum/forum/71-tabber-widget-plugin/

Ronald

[Ronald]

Hi,

add the following code at the end of your child themes stylesheet style.css:

.tabber-widget-rounded-dark ul.tabber-widget-tabs a:hover {
	color: #000 !important;
}

and change the colour to your likings,

that should do the trick,
Ronald

[charrabennett]

Alright - that changed the color of the FONT so at least now you can read it Now how do I change the hover color? LOL! This is a challenge now to get this right!

[Ronald]

Hi,

the code I gave you changes the text color on hover indeed, so this really shouldn't be too difficult to figure out. If you instead wanted to change the background color, add the word "background-" before "color". If you want to change both text and background, add both lines.

.tabber-widget-rounded-dark ul.tabber-widget-tabs a:hover {
	color: #000 !important;
	background-color: #e1771e !important;
}

Ronald

[charrabennett]

Thank you