Vertical tabs overlapping text – plugin CSS bug?

  • Resolved kidznc

    (@wsp-kk)


    7 years ago

    Hello!

    I may – or may not – have found a code conflict between the “Photolite” theme and the Inked Tabs widget that’s part of this plugin.

    My problem is that – exclusively when using the Photolite theme – the tabs will overlap past their containers, interfering with the respective text floating to its right, as follows:

    https://kidzneurosciencecenter.com/wp-content/uploads/2017/11/tabs.jpg

    Now, I realize this sounds more like a problem with the theme, but hear me out: I’ve been ticking and un-ticking CSS in my code inspector, and I can’t find anything associated with the theme’s style.css that’s causing the problem.

    However, unchecking the width property in the following CSS from the tab itself cures the problem every time:

    .iw-so-tabs.iw-so-tabs-vertical .iw-so-tabs-nav .iw-so-tab-title a {
width: 100%; }

    By chance, is there, in fact, a conflict going on here? If I comment that out, the plugin works as intended on Photolite.

    Let me know.

    Thanks!

    -Kurt

    • This topic was modified 7 years ago by kidznc.

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

Viewing 1 replies (of 1 total)
  • Thread Starter kidznc

    (@wsp-kk)

    Just FYI: Believe it or not, I may have found the issue (and it may be, indeed, related to the theme).

    Strangely enough, it happened when I installed a different tab plugin which added the following code:

    *,*::after,*::before {
    box-sizing: inherit;
}

    I added this to my theme CSS, and the problem was solved. No apparent effect on the rest of the existing pages either.

    Thanks again!

    -Kurt

Viewing 1 replies (of 1 total)
  • The topic ‘Vertical tabs overlapping text – plugin CSS bug?’ is closed to new replies.