Template:Tabs

<form class="cdx-tabs__header" method="get" action="https://doc.wikimedia.org/codex/main/components/demos/tabs.html?tab=form-tabs-2#css-only-version">

<button id="form-tabs-1-label" class="cdx-tabs__list__item" role="tab" aria-selected="false" aria-controls="form-tabs-1" value="form-tabs-1" name="tab" > Tab number one </button> <button id="form-tabs-2-label" class="cdx-tabs__list__item" role="tab" aria-selected="true" aria-controls="form-tabs-2" value="form-tabs-2" name="tab" > Tab number two with a longer label </button> <button id="form-tabs-3-label" class="cdx-tabs__list__item" role="tab" aria-selected="false" aria-controls="form-tabs-3" value="form-tabs-3" name="tab" disabled > Tab number three </button> <button id="form-tabs-4-label" class="cdx-tabs__list__item" role="tab" aria-selected="false" aria-controls="form-tabs-4" value="form-tabs-4" name="tab" > Tab number four </button>

</form>

<section id="form-tabs-1" aria-hidden="true" aria-labelledby="form-tabs-1-label" class="cdx-tab" role="tabpanel" tabindex="-1" > Tab 1 content </section> <section id="form-tabs-2" aria-hidden="false" aria-labelledby="form-tabs-2-label" class="cdx-tab" role="tabpanel" tabindex="-1" > Tab 2 content </section> <section id="form-tabs-3" aria-hidden="true" aria-labelledby="form-tabs-3-label" class="cdx-tab" role="tabpanel" tabindex="-1" > Tab 3 content </section> <section id="form-tabs-4" aria-hidden="true" aria-labelledby="form-tabs-4-label" class="cdx-tab" role="tabpanel" tabindex="-1" > Tab 4 content </section>