Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • November 5, 2015 at 7:40 pm #531148
    rutledgeim

    I’m trying to figure out how to center a tabs element on my page and create a color border/highlight color on the tabs similar to the “Blog” and “Ebook” tabs on the homepage of this website – http://www.smartbugmedia.com/.

    • This topic was modified 9 years ago by rutledgeim.
    November 5, 2015 at 10:55 pm #531236
    rutledgeim

    In addition to my previous question – Is there a way to insert a blog post slider and a content slider element inside of a tabbed area?

    November 9, 2015 at 12:31 pm #532508
    Andy

    Hey!

    try this code in Quick CSS field:

    .active_tab {
border-top: 2px solid blue;
}

    and adjust as needed.

    You could try to add slider’s shortcodes into your tab element. For this activate debug mode to be able to see them.

    Cheers!
    Andy

    November 9, 2015 at 6:37 pm #532819
    rutledgeim

    Thanks for getting back to me. Unfortunately, the Quick CSS doesn’t seem to have any effect on the tabs when I added. I activated the debug mode as suggested and I can now see all of the shortcode – but I’m not really sure what to edit to center the tabs. Any other suggestions for how to accomplish these things.

    November 10, 2015 at 5:59 am #533052
    Ismael

    Hey!

    Please add this in the Quick CSS field in order to center align the tab title:

    .tab_titles {
    text-align: center;
}

.tab_titles .tab {
    display: inline-block;
    float: none;
}

    Cheers!
    Ismael

    November 10, 2015 at 4:27 pm #533397
    rutledgeim

    Thanks for your help! That CSS helped center the tabs. Then I was able to apply the border property to the “.tab_titles .tab” for the color border.

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Help with styling tabs element’ is closed to new replies.