Jump to content


Welcome to the forum:

Welcome to the iThemes, PluginBuddy and WebDesign.com forum. We've created several tutorial video's to help you get you started with using the forum, please check them out!

Also take note of the forum guidelines.


Support hours:

Our moderators actively respond to forum support requests during normal business hours which are Monday-Friday, 8am - 5pm Central Standard Time, typically within one business day. Although some moderators choose to work during the weekends, we can not guarantee immediate attention to your requests. Thanks for understanding.

What is included with support:

Premium support includes theme/plugin issues such as: bugs encountered under normal operation, how to use basic features, basic WordPress help, and basic help with customization (meaning we point you to resources and will help in more depth as time allows). More information.

Please Note:

The iThemes offices will be closed Thursday Nov. 27 and Friday Nov. 28 for Thanksgiving.

Support will be limited, as we allow our support staff to spend some well deserved time off with their families. The iThemes Support team wishes you a great Thanksgiving weekend.

information

Tabs Lined Vertically Instead Of Horizontally



This topic has been archived. This means that you cannot reply to this topic.
7 replies to this topic

#1 Evelyn Alba

Evelyn Alba

    Advanced Member

  • Members
  • PipPipPip
  • 208 posts

Posted 16 December 2012 - 10:27 PM

Hi,

I've used the tabber plugin a lot without any issues. This time I'm working with a theme from Elegant Themes and using the tabber widget in a sidebar. The tabs are lined up vertically. I;ve disabled the very few plugins in use, have twicked the css but nothing has workd. Any suggestions to help me?  Thanks.

Site http://caribbeanbeachforsale.com/

Attached Thumbnails

  • tabber.jpg


#2 Elise Alley

Elise Alley

    iThemes Support

  • Administrators
  • Others: All Plugins, All Themes, Members, Moderators, Toolkit, Webdesign
  • 5,876 posts

Posted 17 December 2012 - 08:53 AM

Hi Evelyn,

Looking at the screenshot, it appears as if the tab widths are too wide, which is putting them on their own line.  The site you linked to is behind a maintenance page.  If you can send login information, I can take a look.  You can pm me the information or email it to me at elise@ithemes.com.  Please include a link to this post so I know what it's in regards to.

Thanks,

Elise

#3 Elise Alley

Elise Alley

    iThemes Support

  • Administrators
  • Others: All Plugins, All Themes, Members, Moderators, Toolkit, Webdesign
  • 5,876 posts

Posted 17 December 2012 - 11:42 AM

Hi Evelyn,

It looks like part of the issue is the width of the sidebar you have the Tabber Widgets in.  You can add this code to the bottom of your stylesheet (Appearance > Editor):

.tabber-widget-tabs li {
display: inline-block;
width: 80px;
}

That will make the tabs smaller, but only the first two will appear on the top line as there isn't enough space.  You can widen the Tabber Widget container of course, but that pushes the content out of the sidebar.  When I made the width in the code above 70px instead of 80px, that puts them all on one line, but also makes the box they're in too small for the "Description" tab.

If you choose to make the width 70px, you can try adding this code to the bottom of your stylesheet as well:

.tabber-widget-tabs li a {
text-align: center;
padding-left: 3px !important;
}

Together, those will work.  The word "Description" doesn't look perfectly centered, but unless you're staring and looking at that (like I was :)), I'm not sure anyone else would notice.  

Give that a try and then let us know if you have any additional questions.

Thanks,

Elise

#4 Evelyn Alba

Evelyn Alba

    Advanced Member

  • Members
  • PipPipPip
  • 208 posts

Posted 17 December 2012 - 12:26 PM

Elise,

I tried it. Placed your code in the tabber css, in the parent theme css. Reduced it to 65 px; reduced the tab titles but no change at all.

#5 Elise Alley

Elise Alley

    iThemes Support

  • Administrators
  • Others: All Plugins, All Themes, Members, Moderators, Toolkit, Webdesign
  • 5,876 posts

Posted 17 December 2012 - 12:41 PM

Hi Evelyn,

I'll go back in and take another look.  Looks like you're making changes right now, so I wanted to make sure you knew I was in there, so we're not making changes at the same time.

Thanks,

Elise

#6 Elise Alley

Elise Alley

    iThemes Support

  • Administrators
  • Others: All Plugins, All Themes, Members, Moderators, Toolkit, Webdesign
  • 5,876 posts

Posted 17 December 2012 - 03:25 PM

Hi Evelyn,

I add this to the stylesheet (Appearance > Editor):

.tabber-widget-basic-dark ul.tabber-widget-tabs li {
float: none !important;
}

That seems to have taken care of the issue.

Let me know if you have any other questions.

Thanks,

Elise

#7 Evelyn Alba

Evelyn Alba

    Advanced Member

  • Members
  • PipPipPip
  • 208 posts

Posted 17 December 2012 - 05:36 PM

Wow! I owe you one. Thanks!!!

#8 Elise Alley

Elise Alley

    iThemes Support

  • Administrators
  • Others: All Plugins, All Themes, Members, Moderators, Toolkit, Webdesign
  • 5,876 posts

Posted 17 December 2012 - 05:39 PM

Happy to have helped, Evelyn!  Let us know if you have any additional questions.

Thanks,

Elise