Tab documentation updated

docs/tab.html

@@ -43,7 +43,7 @@
     <!-- Insert your page content here-->
     <main><div class="container">
       <div class="row" style="padding-top: 40px;">
-        <div class="col-sm">
+        <div class="col-sm col-lg-10 col-lg-offset-1">
           <h1>Tab</h1>
           <p>The <strong>tab</strong> module aims to combine multiple components and design paradigms, like collapses, accordions, carousels and tabs, into one general-purpose component. Tabs are very simple in structure, responsive on mobile and they allow for layout customization so that you can turn them into accordions or collapses whenever you want.</p>
           <p><small>All examples showcased refer to the mini-default flavor, some class names and styles might differ based on the flavor you're using.</small></p>
@@ -51,7 +51,7 @@
         </div>
       </div>
       <div class="row">
-        <div class="col-sm">
+        <div class="col-sm col-lg-10 col-lg-offset-1">
           <div class="card fluid">
             <div class="section">
               <h2>Quick overview</h2>
@@ -66,7 +66,7 @@
         </div>
       </div>
       <div class="row">
-        <div class="col-sm">
+        <div class="col-sm col-lg-10 col-lg-offset-1">
           <div class="card fluid">
             <div class="section"><h2>Basic syntax</h2></div>
             <div class="section row">
@@ -128,6 +128,7 @@
                 <li>Tabs are compatible with modern browsers, but might not display properly in older browsers.</li>
                 <li>Remember to add the <code><span class="fore-secondary">checked</span></code> attribute to one of your <code>&lt;input&gt;</code>s if you want that tab to be the one displayed by default. If none is specified, the first one will be displayed.</li>
                 <li>The <code>height</code> of the tab container's panel area is <code>400px</code>. If you want to change this default size, please check out the <a href="customization.html">customization</a> page.</li>
+				<li>Using the method described above for making tabs accessible, screen readers will ignore tab controls and only read the content of tabs.</li>
               </ul><hr>
               <div class="row">
                 <div class="col-sm-12 col-md-6 col-sm-last col-md-normal">
@@ -181,7 +182,7 @@
         </div>
       </div>
       <div class="row">
-        <div class="col-sm">
+        <div class="col-sm col-lg-10 col-lg-offset-1">
           <div class="card fluid">
             <div class="section"><h2>Stacked tabs</h2></div>
             <div class="section row">
@@ -268,7 +269,7 @@
         </div>
       </div>
       <div class="row" style="padding-bottom: 20px; padding-top:20px;">
-        <div class="col-sm">
+        <div class="col-sm col-lg-10 col-lg-offset-1">
           <p>If you want to learn more about <strong>mini.css</strong>'s modules, go back to the <a href="modules.html">modules page</a> and choose another module to see its documentation.</p>
         </div>
       </div>

docs/v2/DEVLOG.md

@@ -844,3 +844,8 @@
 - Fixed the `pre` segments in `grid.html`.
 - Made `header` `logo` element un`transition` conditional.
 - Updated `utility.html` to display as required on larger displays.
+
+## 20170208
+
+- Fed **hugging cat**, it's even happier now.
+- Updated `tab.html` with some minor accessibility guidelines and new layout.