Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #297924

    http://kriesi.at/themes/enfold/shortcodes/tabs/

    Is it possible to have the tabs cover the entire top and the font be centered?

    For example:
    http://cleaning.maximfactory.com/office-cleaning-services/

    How would I make it so the tabs cover the entire top of the box and then have the titles centered within the tab, like they already appear to be?

    Thanks

    #297966

    Hey Micheal0424!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    @media only screen and (min-width: 1140px) { 
    .page-id-22 .top_tab .tab { padding: 12px 25px 14px 24px; }}
    .tab_inner_content h3 { text-align: center; }

    Cheers!
    Yigit

    #298002

    http://cleaning.maximfactory.com/office-cleaning-services/#tab-id-1

    That centered the title within in the box itself.

    I meant for the tabs themselves to cover the top of the entire box instead.

    Thanks.

    #298005

    Hi!

    Is not this how you would like it to look – http://i.imgur.com/TR692s1.png ?
    If it is, please flush browser cache and refresh your page a few times. If not, please post a screenshot and show

    Regards,
    Yigit

    #298062

    I cleared everything out and used different browsers as well and I still get this. I added the code hours ago and even shut the computer down since then. Not sure why you are able to see it how I would like it done and it doesn’t show on mine.

    Really confused here?

    Any ideas?

    Thanks.

    http://cleaning.maximfactory.com/wp-content/uploads/2014/07/Sample1.png

    #298240

    Hey!

    What is the resolution of the screen you are using? Could you be zoomed in on the browser by any chance? I tried changing screen resolution but it does look fine on my end

    Cheers!
    Yigit

    #298275

    I actually checked that, no luck there. I even adjusted it to double check.

    Really confused here, I can’t figure out why it is different.

    I am going to keep thinking of what it could be and maybe I will stumble on the answer.

    Thanks.

    #299279

    Hi!

    Try to change the padding values of Yigits code and use this code instead

    
    @media only screen and (min-width: 1140px) { 
    .page-id-22 .top_tab .tab {
    padding: 12px 28px 14px 29px;
    }
    }
    .tab_inner_content h3 { text-align: center; }
    

    Replace 28 and 29px with other values (i.e. 27 and 28) if necessary.

    Best regards,
    Peter

    #299374

    That worked, thanks for the help!!

    #299375

    The fix created another issue.

    When I click on last two tabs it shifts the last tab below the others, how do I fix this?

    Thanks.

    #299648

    Hey!

    Please add following code to Quick CSS as well to

    .js_active .active_tab { font-weight: normal; }

    font weight of active tab title is bold, this code should turn tab titles to normal weight and fix the issue

    Best regards,
    Yigit

    #299724

    Worked like a charm, thanks!!

Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Tabs cover entire top of box?’ is closed to new replies.