Bullets in custom tabs

  • Resolved mheinen1critical

    (@mheinen1critical)


    6 years, 4 months ago

    I can only see bulleted lists in the default “Description” tab of a woocommerce product.

    In my custom tabs, even with things being bulleted in a list in the editor, the bullets do not appear.

    See difference between “Description” and “Specification”. There are specifications wrapped in < ul > , < li > codes but no bullet points appear. Please help.

    The page I need help with: [log in to see the link]

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Contributor yikesitskevin

    (@yikesitskevin)

    Hi @mheinen1critical,

    There are some styles from your theme that are causing this. These styles are preventing the bullet points in custom tabs: https://imgur.com/a/HLd9O4R.

    And these styles (directly from WooCo) are overriding the theme’s base.css file: https://imgur.com/a/oHNyp5V.

    You could use CSS like this to override the theme and allow bullet points in custom tabs:

    .wc-tab ul {
    list-style-type: disc;
}

    Cheers,
    Kevin.

    Thread Starter mheinen1critical

    (@mheinen1critical)

    Perfect. Thanks.
    Could you also add for me CSS code to get a “1 px bottom border” on the top row of tabs when there are two rows of tabs?

    Plugin Contributor yikesitskevin

    (@yikesitskevin)

    There’s no easy way to determine if there are two rows of tabs. However, adding a subtle grey bottom border to all tabs doesn’t look bad (in my opinion). Try this out.

    div.product .woocommerce-tabs ul.tabs li {
    border-bottom: 1px solid #e1e1e1;
}

    Let me know.

    Cheers,
    Kevin.

    Thread Starter mheinen1critical

    (@mheinen1critical)

    Again. Awesome. Looks good. Thanks for the codes and the quick response. A+

    Plugin Contributor yikesitskevin

    (@yikesitskevin)

    No problem. Have a nice day/night/morning ??

    anilinsan

    (@anilinsan)

    Hi @yikesitskevin I see in couple of other tickets that you have shared following to remove the bullets completely

    .widgets_on_page ul>li:before {
    content: none;
    }

    however it’s not working for me at all. I have checked all possible solutions shared in all type of support tickets but it’s not helping.

    Can you please check the middle bar (Subjects we teach) which is using your plugin from this link

    https://learn-extra.com/sat-complete-test-preparation/

    Also it got some extra space on top. Can you pls check and help.

    anilinsan

    (@anilinsan)

    no worries I figured it out.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Bullets in custom tabs’ is closed to new replies.