AnsweredAssumed Answered

Multiple tab sections on the same page.

Question asked by Matt Bartlett on Jul 7, 2017
Latest reply on Sep 7, 2017 by chofer@morainepark.edu

Hello All.

 

I am trying to add 2 separate tabs groups/section/bits to a course.

 

I'm not sure what I'm doing wrong but the titles for each tab appear in both of the tabs groups. In the screen shots below (sorry if they look bad but this input box has shrunk them) I've highlighted the issue. In picture 1 there are three links that are supposed to be for a completely separate tab section at the bottom of the page.

The second screenshot shows this separate tab section but again the tab titles from the first section have appeared as well.

Interestingly enough when you click on the titles in each tab section the content of each tab only shows in the correct section.

I.e in screenshot 1 if you click on the circled linked it doesn't show you any content for the Stakeholder mapping tool and the same with the Account or practice links in the second screen shot.

 

Our code is formatted as so:

<div id="kl_wrapper" class="kl_bookmark"></div>
<div class="kl_tabbed_section">
<h4 class="kl_tab_0">This is the FIRST tab in the FIRST tab section</h4>
<div id="kl_tab_0" class="kl_tab_content kl_tab_0">
<p>Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah</p>
</div>
<h4 class="kl_tab_1">This is the SECOND tab in the FIRST tab section</h4>
<div id="kl_tab_1" class="kl_tab_content kl_tab_1">
<p>Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah</p>
</div>
</div>

 

Insert filler

 

<div class="kl_tabbed_section">
<h4 class="kl_tab_0">This is the FIRST tab in the SECOND tab section</h4>
<div id="kl_tab_0" class="kl_tab_content kl_tab_0">
<p>Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah</p>
</div>
<h4 class="kl_tab_1">This is the SECOND tab in the SECOND tab section</h4>
<div id="kl_tab_1" class="kl_tab_content kl_tab_1">
<p>Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah</p>
</div>
</div>

 

 

 

 

Kind Regards

 

Matt

Outcomes