CSS conflict Magazine to NoNumber tabs

Hello,

Working my way through the magazine J3.+ template and migrating from an earlier J 2.5 Gavic template.

I have found a conflict with the popular 'Tabs' component from nonumber.nl and 2 errors displaying.
The tab component border seems broken and the tabs have an unknown icon displaying between them.

I use this component on all Gavic templates and it seems to work seamlessly in J2.5+ versions

Here is a screen shot
Here is the code in use. (you can see there is not much there to go wrong)

Code: Select all

{tab <img alt="thumbsUp" src="images/icons/thumbsUp.png" />start the tabs here}
<p>Your text...</p>
<p>{tab second tab here}</p>
<p>Your text...</p>
<p>{/tabs}</p>

The site is currently DEV. Can I PM the details please to see if its a simple fix?

Kind regards
Drew

Please send me a PM with:
1. URL to your website
2. login and password of user with admin/super-admin privileges (please create one for me)
3. link to this thread

Please send me a PM with:
1. URL to your website
2. login and password of user with admin/super-admin privileges (please create one for me)
3. link to this thread

Hello,
Just checking you received the PM?

Sorry, but provided url shows internal server error.

Please edit: /templates/gk_magazine/css/override.css and add at its end:

Code: Select all

#k2Container .itemFullText .nn_tabs ul {margin: 2em 0 0;}
#k2Container .itemFullText .nn_tabs ul li {background: none; padding-left: 0px; padding-bottom: 0px;}


Remember to enable "CSS override" in template settings - advanced section.

Perfect fix - appreciate your help - this has saved me a 'lot' of extra work.
You guys rock.

Thanks for appreciation

Hello again,

Just coming back to this issue, it looks like the fix you gave me for the override fixing the NoNumber issue, broke the 'indent' feature

Can you have a look at the fix again please and give me some ideas please?

If you need me to PM the DEV site details again, juts let me know.

Kind regards
Drew

Please send me a PM with:
1. URL to your website
2. login and password of user with login privileges (please create one for me)
3. link to this thread
4. Link to both locations - one with NoNumber tabs where it is ok and one to a place where it is not.

I don't know what do you mean by indent feature - could you create a screenshot of how should it look correctly?

Hello,
Thanks for your patience in this one. Here is the step by step summary.

The NoNumber tabs component has a conflict with the Gavick template.

1. The tabs are broken apparent. see capture 1.[img]

capture-1---conflict.gif

[/img]

2. This is how the indent feature looks, see capture 2:

3. When the override is applied, the tabs conflict is more or less fixed, but then the indent feature breaks, capture 3 see sample.

This is the override code used:

Code: Select all

#k2Container .itemFullText .nn_tabs ul {margin: 2em 0 0;}
#k2Container .itemFullText .nn_tabs ul li {background: none; padding-left: 0px; padding-bottom: 0px;}

I have currently removed the override.
What are your thoughts?

Kind regards
Drew

Ok, thanks for all the screens - now I get whats wrong:

Code: Select all

#k2Container .itemFullText .nn_tabs ul.nav-tabs {margin: 2em 0 0;}
#k2Container .itemFullText .nn_tabs ul.nav-tabs li {background: none; padding-left: 0px; padding-bottom: 0px;}


Should fix it.

Thank you
Nailed it !

thanks for the help
Drew