Little problem with tabs appearing when I don't want them to (9 posts)

  1. ionblue
    Posted 3 years ago #

    So this is a weird one. I need the ability to use unordered lists INSIDE the product description tab. Shouldn't be a problem except for some reason woocommerce is putting the UL into it's tab styling - which is NOT what I want. And no matter what I've tried so far to override it, I can't.

    Have a look here to see what's happening INSIDE the description area:

    Any help in getting around this would be greatly appreciated. Thanks.



  2. Roy Ho
    Posted 3 years ago #

    The styles are applied from your themes. Why can't you modify it?

  3. ionblue
    Posted 3 years ago #

    No. It's applied by the default woocommerce styles and the style controls ALL the woocommerce tabs. The problem is that if I put a list INSIDE the description, woocommerce should NOT be turning that into a tab group. See the problem?

  4. Roy Ho
    Posted 3 years ago #

    No?? I thought you wanted help? I am trying to help you but it seems you refuse to believe me. I have already checked your site prior to me posting so YES, what I am saying is correct!

    The style is coming from your shopsum folder...some in default.css and some in styles.css

  5. ionblue
    Posted 3 years ago #

    Ok. But you're still missing my point. Why is woocommerce turning a list into a tab group by default? It shouldn't do this with content inside the description area. But it is.

    And I've tried every trick I know of with CSS to override the themes CSS and it doesn't work. If I actually remove all the styling you see, it completely destroys all the other tabs.

    Can you not see this when looking at the code and what's being applied? I'm not trying to be difficult, I just can't see a solution to this without changing some of the code - which I'm not qualified to do.

  6. Roy Ho
    Posted 3 years ago #

    ...You're not listening...I did not miss your point. I am telling you the reason why your UL inside the tabs appear to "look" like tabs is because of the styles per the files I mentioned above.

    So there are many ways to fix this. You can either put a > selector on the ones that are really tabs so the styles ONLY effect the direct child OR you can override the code by giving your UL a class and styling that.

  7. ionblue
    Posted 3 years ago #

    I tried using a class and it didn't work at all. None of the styling overrode what's there already. I'll keep futzing around with it.

  8. Roy Ho
    Posted 3 years ago #

    Try this...open up your style.css on line 868 where it says:

    div.woocommerce_tabs li

    Change it to

    div.woocommerce_tabs > ul li

  9. ionblue
    Posted 3 years ago #

    THANK YOU! That did the trick. I honestly don't know anything about that selector, so I guess I'd better dig into learning more CSS.

    Thank you again.

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • WooCommerce
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic


No tags yet.