Tab Icon Font Size

[psmorrow]

Hi there,

I’m using a “Tab” page element, and I would like to increase font size of the tab icons.   Can you help me with the css snytax?

[psmorrow]

here is the css that I wrote that does not work:

COPY CODE

.wpb-js-composer .vc_tta.vc_general {
    font-size: 8em;
    line-height: 1;
    display: inline;
}

[Kieran_SQ]

Hi,

If the WP Bakery (formerly Visual Composer) element you’re using is ‘Tabs’ and not ‘Kleo Tabs’ then you can use the below CSS to increase the size of the icon in the tab.

.wpb-js-composer .vc_tta.vc_general .vc_tta-icon {font-size: 1.5em;}

Note the size is expressed in em and not px, the default value for the tab icon is 1.15, I have increased this in the example above to 1.5

Thanks,

Kieran.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[psmorrow]

SOrry to say it doesn’t seem to be working. Is there a setting that disables custom css somewhere that might be preventing css edits?

[Kieran_SQ]

Hi,

There is no setting in KLEO that would disable CSS edits, nor any in WordPress by default that I know of. Please make sure you clear your website cache, any CDN and local cache (Ctrl+F5) to see any changes.

Kieran.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[psmorrow]

I’ve cleared local cache and sorry to say the css still does not change the font size of the icon. As shown in attached screenshots.

I am able to edit other page elements with css. Wondering if its a syntax issue?

Any other suggestions?

Attachments:

You must be logged in to view attached files.

[Kieran_SQ]

Hi,

Please try this with an important statement

.wpb-js-composer .vc_tta.vc_general .vc_tta-icon {font-size: 1.5em !important;}

Also please try adding to the style.css in the child theme or in theme options instead of via the customizer.

If neither of the above steps work please copy all of the shortcode contents and share here using the code tags so I can see exactly how your page is setup.

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[psmorrow]

This seems to work, thanks!

COPY CODE

.wpb-js-composer .vc_tta.vc_general .vc_tta-tab {
	line-height:1.5;
	font-size: 2em;
	}

[Author]

Posts