Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #683423

    How do I change the font size of the tabs?

    #683974

    Hey heatcheck,

    Could you post a link to the site in question so that we can take a closer look please?

    Regards,
    Rikard

    #683976

    I would like to be able to change the font size, or color, or being able to bold it. Thanks!

    #684058

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    #top .tab{
     color:#000;
     font-weight:600;
    }
    /* Active Tab Color */
    #top .tab .active_tab {
     color:red;
     font-weight:800;
    }
    
    

    Best regards,
    Vinay

    #707921

    Hi
    I am using tabs on the left.
    I tried the CSS fixes above and it worked for font weight change. But I wonder how can increase actual font size to say 12 or 13px?
    See screenshot of my page:-
    http://screencast.com/t/R9hjfqoazGoX

    The CSS colour change worked for the tab on side – BUT
    The CSS for changing the ACTIV tab didn’t work for me. Is there a similar set of CSS to change colours on activ tab for side tabs?

    Thanks for your help.
    Pete

    #708080

    Hi Pete,

    Please try this instead:

    #top .tab{
     color:#000;
     font-weight:600;
     font-size:13px;
    }
    /* Active Tab Color */
    #top .tab .active_tab {
     color:red;
     font-weight:800;
     font-size:13px;
    }

    Best regards,
    Rikard

    #708134

    HI Rikard
    thanks so much for that – the font size works great.
    However the active tab is not picking up the weight or colour when your CSS is used.
    See screenshot
    http://screencast.com/t/0T3zsbmr8c
    Any ideas how I can change that to get the extra weight and change colour for my side tab?

    Also wondered how I can control the colour of the active tab and the font colour in Mobile view.(responsive) ?
    I like that it changes to my theme colour of yellow for the tab colour – but the font colour is changing to white which makes it hard to read.
    I think this colour scheme might be the same as default buttons in my theme – can you confirm this and let me know how to change it.
    I’d like to have a way to change the active tab colour to my theme dark grey #1e2023 and the font to yellow #ffcc00
    Screenshot:-
    http://screencast.com/t/5dCUeQMJmJ

    Thanks for all your help on this.
    Best
    Pete

    #708561

    Hi Pete,

    It might be that the font doesn’t have that particular weight, could you try some other weight maybe? If you can’t get it to work then please post a link to your site so that we can have a closer look at it.

    Best regards,
    Rikard

    #708693

    Hi Rikard,

    The font weights are definitely there for open sans. It just needed different CSS to make it work and I found a fix as below.

    /* Active Tab Color */
    #top .main_color .tabcontainer .tab.active_tab {
    color: #ffcc00;
    font-weight: 700;
    font-size:14px;
    }

    I also found a way to colour the Active tab background – without it changing the tab content surrounding frame – if people wish to do this. The Active tab colour ALSO carries over to be used in the mobile / responsive view and looks nice. Hope its helpful for others.

    .tabcontainer .active_tab {
    background-color: #1e2023 !important;
    }

    Screenshot for my CSS
    http://screencast.com/t/Le6aChYHxqd

    #708779

    Hi,

    Great, glad you got it working and thanks for sharing :-)

    Please let us know if you should need any further help on the topic.

    Best regards,
    Rikard

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.