Tabby Responsive Tabs
[resolved] tab outline issues (4 posts)

  1. cece101
    Posted 1 year ago #

    Hello - thanks for the free plugin. Everything is working fine except for the outline of the tabs - the line is broken and not pronounced. Please help



  2. cubecolour
    Plugin Author

    Posted 1 year ago #

    I've seen this before with some of the older Genesis child themes.

    The stylesheet of your theme is overriding the rules in the tabby stylesheet so the padding values do not take effect. The #content ID seem to be the culprit eg

    #content .post ul, #content .page ul {
    	list-style-type: square;
    	margin: 0;
    	padding: 0 0 15px 0;
    #content .post ul li, #content .page ul li {
    	list-style-type: square;
    	margin: 0 0 0 20px;
    	padding: 0;

    To remedy this you can replace the tabby stylesheet as described in the plugin's documentation and edit the rules to increase the specificity.

    Adding #content to the rules that are not taking effect should do it.


    #content .responsive-tabs .responsive-tabs__list {
    	font-size: 18px;
    	line-height: 18px;
    	margin: 20px 0 10px 0;
    #content .responsive-tabs .responsive-tabs__list__item {
    	border: 1px solid transparent;
    	border-bottom: none;
    	line-height: 1;
    	margin: 0 14px 0 0;
    	padding: 10px 20px;

    Some other rules will probably also need similar tweakage.

  3. cece101
    Posted 1 year ago #

    Thanks for the quick response. I am following along pretty well with what you are saying. Just need to know exactly where I should add this code - where are the copy of the rules?


  4. cubecolour
    Plugin Author

    Posted 1 year ago #

    you'll find the original tabby rules in the tabby.css file in the plugin. Your edited version can be added to your child theme's stylesheet or plugin that allows custom css rules to be added.

    if you are using customised styles like this, the original styles in the plugin are no longer needed and you should prevent this stylesheet from loading by adding to your child theme's functions.php

    <?php remove_action('wp_print_styles', 'cc_tabby_css', 30); ?>

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Tabby Responsive Tabs
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic