accordion/tabs values order

Show two html examples of data-responsive-accordion-tabs values in different orders.

diff --git a/docs/pages/responsive-accordion-tabs.md b/docs/pages/responsive-accordion-tabs.md
index 8f263b077ebff83eb13252a91743ee2d6d555fed..3f5956bc3dec8157def39e670d2c96e7e3e57022 100644 (file)
--- a/docs/pages/responsive-accordion-tabs.md
+++ b/docs/pages/responsive-accordion-tabs.md
@@ -29,6 +29,22 @@ Accordion content should also have an ID, or the # of the href should be specifi
 </ul>
 ```
 
+<div class="secondary callout">
+  <p>The accordion/tabs values can be in any order.</p>
+</div>
+
+```html
+<ul class="tabs" data-responsive-accordion-tabs="tabs medium-accordion large-tabs">
+  <li class="accordion-item is-active" data-accordion-item>
+    <a href="#" class="accordion-title">Accordion 1</a>
+    <div class="accordion-content" data-tab-content>
+      I would start in the open state, due to using the `is-active` state class.
+    </div>
+  </li>
+  <!-- ... -->
+</ul>
+```
+
 <div class="secondary callout">
   <p>Once you put it all together, here's what you get!<br>Scale your browser down to see the toggle happen.<br>I am an `Accordion on small and large` but I am `Tabs on medium`</p>
 </div>