I tried doing this but the tabs dont work. When I click to Item Two
, it doesn't navigate. What am i missing?
<div class="slds-tabs--scoped">
<ul class="slds-tabs--scoped__nav" role="tablist">
<li class="slds-tabs__item slds-text-heading--label slds-active" title="Item One" role="presentation"><a href="#" role="tab" tabindex="0" aria-selected="true">Item One</a></li>
<li class="slds-tabs__item slds-text-heading--label" title="Item Two" role="presentation"><a href="#" role="tab" tabindex="-1" aria-selected="false">Item Two</a></li>
<li class="slds-tabs__item slds-text-heading--label" title="Item Three" role="presentation"><a href="#" role="tab" tabindex="-1" aria-selected="false">Item Three</a></li>
</ul>
<div class="slds-tabs__content slds-show" role="tabpanel">
<h2>Item One Content</h2>
</div>
<div class="slds-tabs__content slds-hide" role="tabpanel">
<h2>Item Two Content</h2>
</div>
<div class="slds-tabs__content slds-hide" role="tabpanel">
<h2>Item Three Content</h2>
</div>
</div>