WordPress.org

Ready to get started?Download WordPress

Forums

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

  1. cece101
    Member
    Posted 2 months 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

    http://secretaryofstatefiling.com/filing-forms/

    https://wordpress.org/plugins/tabby-responsive-tabs/

  2. cubecolour
    ɹoʇɐɹǝpoɯ
    Plugin Author

    Posted 2 months 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.

    eg:

    #content .responsive-tabs .responsive-tabs__list {
    	font-size: 18px;
    	line-height: 18px;
    	margin: 20px 0 10px 0;
    	padding-bottom: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
    Member
    Posted 2 months 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?

    Thanks.

  4. cubecolour
    ɹoʇɐɹǝpoɯ
    Plugin Author

    Posted 2 months 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); ?>

Reply

You must log in to post.

About this Plugin

About this Topic