Test Start

Browser Statistics for 2010 by Month
2010 Internet Explorer Firefox Chrome Safari Opera
October 29.7 % 44.1% 19.2% 3.9% 2.2%
September 31.1 % 45.1% 17.3% 3.7% 2.2%
August 30.7 % 45.8% 17.0% 3.5% 2.3%
July 30.4 % 46.4% 16.7% 3.4% 2.3%
June 31.0 % 46.6% 15.9% 3.6% 2.1%
May 32.2 % 46.9% 14.5% 3.5% 2.2%
April 33.4 % 46.4% 13.6% 3.7% 2.2%
March 34.9 % 46.2% 12.3% 3.7% 2.2%
February 35.3 % 46.5% 11.6% 3.8% 2.1%
January 36.2 % 46.3% 10.8% 3.7% 2.2%
2009 Internet Explorer Firefox Chrome Safari Opera
December 37.2 % 46.4% 9.8% 3.6% 2.3%
November 37.7 % 47.0% 8.5% 3.8% 2.3%
October 37.5 % 47.5% 8.0% 3.8% 2.3%
September 39.6 % 46.6% 7.1% 3.6% 2.2%
August 39.3 % 47.4% 7.0% 3.3% 2.1%
July 39.4 % 47.9% 6.5% 3.3% 2.1%
June 40.7 % 47.3% 6.0% 3.1% 2.1%
May 41.0 % 47.7% 5.5% 3.0% 2.2%
April 42.1 % 47.1% 4.9% 3.0% 2.2%
March 43.3 % 46.5% 4.2% 3.1% 2.3%
February 43.6 % 46.4% 4.0% 3.0% 2.2%
January 44.8 % 45.5% 3.9% 3.0% 2.3%

Data is from www.w3schools.com

Test End

Rule References

Rule Pass IDs Fail IDs
Rule 6
  • id1
 none

Calculations

No calculations for test 75

Test Description

  • This test contains a complex data table.
    * The th elements have IDs.

Test Markup

User Agent Implementation

No user agent implementation information.

HTML Source Code


<div class="wrapper">
  <table id="id1" class="statsTable" border="1" summary="2010 Browser Statistics by Month. Data is from www.w3schools.com">
   <caption>Browser Statistics for 2010 by Month</caption>
   <tbody><tr>
    <th id="yr1" class="heading">2010</th>
    <th id="yr1_IE" class="heading">Internet Explorer</th>
    <th id="yr1_FF" class="heading">Firefox</th>
    <th id="yr1_Chrome" class="heading">Chrome</th>
    <th id="yr1_Safari" class="heading">Safari</th>
    <th id="yr1_Opera" class="heading">Opera</th>
  </tr>
  <tr>
    <th id="yr1_Oct" class="rowHead">October</th>
    <td headers="yr1_IE yr1_Oct">29.7 %</td>
    <td headers="yr1_FF yr1_Oct">44.1%</td>
    <td headers="yr1_Chrome yr1_Oct">19.2%</td>
    <td headers="yr1_Safari yr1_Oct">3.9%</td>
    <td headers="yr1_Opera yr1_Oct">2.2%</td>
    </tr>
  <tr>
    <th id="yr1_Sep" class="rowHead">September</th>
    <td headers="yr1_IE yr1_Sep">31.1 %</td>
    <td headers="yr1_FF yr1_Sep">45.1%</td>
    <td headers="yr1_Chrome yr1_Sep">17.3%</td>
    <td headers="yr1_Safari yr1_Sep">3.7%</td>
    <td headers="yr1_Opera yr1_Sep">2.2%</td>
    </tr>
  <tr>
    <th id="yr1_Aug" class="rowHead">August</th>
    <td headers="yr1_IE yr1_Aug">30.7 %</td>
    <td headers="yr1_FF yr1_Aug">45.8%</td>
    <td headers="yr1_Chrome yr1_Aug">17.0%</td>
    <td headers="yr1_Safari yr1_Aug">3.5%</td>
    <td headers="yr1_Opera yr1_Aug">2.3%</td>
    </tr>
  <tr>
    <th id="yr1_Jul" class="rowHead">July</th>
    <td headers="yr1_IE yr1_Jul">30.4 %</td>
    <td headers="yr1_FF yr1_Jul">46.4%</td>
    <td headers="yr1_Chrome yr1_Jul">16.7%</td>
    <td headers="yr1_Safari yr1_Jul">3.4%</td>
    <td headers="yr1_Opera yr1_Jul">2.3%</td>
    </tr>
  <tr>
    <th id="yr1_Jun" class="rowHead">June</th>
    <td headers="yr1_IE yr1_Jun">31.0 %</td>
    <td headers="yr1_FF yr1_Jun">46.6%</td>
    <td headers="yr1_Chrome yr1_Jun">15.9%</td>
    <td headers="yr1_Safari yr1_Jun">3.6%</td>
    <td headers="yr1_Opera yr1_Jun">2.1%</td>
    </tr>
  <tr>
    <th id="yr1_May" class="rowHead">May</th>
    <td headers="yr1_IE yr1_May">32.2 %</td>
    <td headers="yr1_FF yr1_May">46.9%</td>
    <td headers="yr1_Chrome yr1_May">14.5%</td>
    <td headers="yr1_Safari yr1_May">3.5%</td>
    <td headers="yr1_Opera yr1_May">2.2%</td>
    </tr>
  <tr>
    <th id="yr1_Apr" class="rowHead">April</th>
    <td headers="yr1_IE yr1_Apr">33.4 %</td>
    <td headers="yr1_FF yr1_Apr">46.4%</td>
    <td headers="yr1_Chrome yr1_Apr">13.6%</td>
    <td headers="yr1_Safari yr1_Apr">3.7%</td>
    <td headers="yr1_Opera yr1_Apr">2.2%</td>
    </tr>
  <tr>
    <th id="yr1_Mar" class="rowHead">March</th>
    <td headers="yr1_IE yr1_Mar">34.9 %</td>
    <td headers="yr1_FF yr1_Mar">46.2%</td>
    <td headers="yr1_Chrome yr1_Mar">12.3%</td>
    <td headers="yr1_Safari yr1_Mar">3.7%</td>
    <td headers="yr1_Opera yr1_Mar">2.2%</td>
  </tr>
  <tr>
    <th id="yr1_Feb" class="rowHead">February</th>
    <td headers="yr1_IE yr1_Feb">35.3 %</td>
    <td headers="yr1_FF yr1_Feb">46.5%</td>
    <td headers="yr1_Chrome yr1_Feb">11.6%</td>
    <td headers="yr1_Safari yr1_Feb">3.8%</td>
    <td headers="yr1_Opera yr1_Feb">2.1%</td>
  </tr>
  <tr>
    <th id="yr1_Jan" class="rowHead">January</th>
    <td headers="yr1_IE yr1_Jan">36.2 %</td>
    <td headers="yr1_FF yr1_Jan">46.3%</td>
    <td headers="yr1_Chrome yr1_Jan">10.8%</td>
    <td headers="yr1_Safari yr1_Jan">3.7%</td>
    <td headers="yr1_Opera yr1_Jan">2.2%</td>
  </tr>
  <tr>
    <th id="yr2" class="heading">2009</th>
    <th id="yr2_IE" class="heading">Internet Explorer</th>
    <th id="yr2_FF" class="heading">Firefox</th>
    <th id="yr2_Chrome" class="heading">Chrome</th>
    <th id="yr2_Safari" class="heading">Safari</th>
    <th id="yr2_Opera" class="heading">Opera</th>
  </tr>
  <tr>
    <th id="yr2_Dec" class="rowHead">December</th>
    <td headers="yr2_IE yr2_Dec">37.2 %</td>
    <td headers="yr2_FF yr2_Dec">46.4%</td>
    <td headers="yr2_Chrome yr2_Dec">9.8%</td>
    <td headers="yr2_Safari yr2_Dec">3.6%</td>
    <td headers="yr2_Opera yr2_Dec">2.3%</td>
  </tr>
  <tr>
    <th id="yr2_Nov" class="rowHead">November</th>
    <td headers="yr2_IE yr2_Nov">37.7 %</td>
    <td headers="yr2_FF yr2_Nov">47.0%</td>
    <td headers="yr2_Chrome yr2_Nov">8.5%</td>
    <td headers="yr2_Safari yr2_Nov">3.8%</td>
    <td headers="yr2_Opera yr2_Nov">2.3%</td>
  </tr>
  <tr>
    <th id="yr2_Oct" class="rowHead">October</th>
    <td headers="yr2_IE yr2_Oct">37.5 %</td>
    <td headers="yr2_FF yr2_Oct">47.5%</td>
    <td headers="yr2_Chrome yr2_Oct">8.0%</td>
    <td headers="yr2_Safari yr2_Oct">3.8%</td>
    <td headers="yr2_Opera yr2_Oct">2.3%</td>
  </tr>
  <tr>
    <th id="yr2_Sep" class="rowHead">September</th>
    <td headers="yr2_IE yr2_Sep">39.6 %</td>
    <td headers="yr2_FF yr2_Sep">46.6%</td>
    <td headers="yr2_Chrome yr2_Sep">7.1%</td>
    <td headers="yr2_Safari yr2_Sep">3.6%</td>
    <td headers="yr2_Opera yr2_Sep">2.2%</td>
  </tr>
  <tr>
    <th id="yr2_Aug" class="rowHead">August</th>
    <td headers="yr2_IE yr2_Aug">39.3 %</td>
    <td headers="yr2_FF yr2_Aug">47.4%</td>
    <td headers="yr2_Chrome yr2_Aug">7.0%</td>
    <td headers="yr2_Safari yr2_Aug">3.3%</td>
    <td headers="yr2_Opera yr2_Aug">2.1%</td>
  </tr>
  <tr>
    <th id="yr2_Jul" class="rowHead">July</th>
    <td headers="yr2_IE yr2_Jul">39.4 %</td>
    <td headers="yr2_FF yr2_Jul">47.9%</td>
    <td headers="yr2_Chrome yr2_Jul">6.5%</td>
    <td headers="yr2_Safari yr2_Jul">3.3%</td>
    <td headers="yr2_Opera yr2_Jul">2.1%</td>
  </tr>
  <tr>
    <th id="yr2_Jun" class="rowHead">June</th>
    <td headers="yr2_IE yr2_Jun">40.7 %</td>
    <td headers="yr2_FF yr2_Jun">47.3%</td>
    <td headers="yr2_Chrome yr2_Jun">6.0%</td>
    <td headers="yr2_Safari yr2_Jun">3.1%</td>
    <td headers="yr2_Opera yr2_Jun">2.1%</td>
  </tr>
  <tr>
    <th id="yr2_May" class="rowHead">May</th>
    <td headers="yr2_IE yr2_May">41.0 %</td>
    <td headers="yr2_FF yr2_May">47.7%</td>
    <td headers="yr2_Chrome yr2_May">5.5%</td>
    <td headers="yr2_Safari yr2_May">3.0%</td>
    <td headers="yr2_Opera yr2_May">2.2%</td>
  </tr>
  <tr>
    <th id="yr2_Apr" class="rowHead">April</th>
    <td headers="yr2_IE yr2_Apr">42.1 %</td>
    <td headers="yr2_FF yr2_Apr">47.1%</td>
    <td headers="yr2_Chrome yr2_Apr">4.9%</td>
    <td headers="yr2_Safari yr2_Apr">3.0%</td>
    <td headers="yr2_Opera yr2_Apr">2.2%</td>
  </tr>
  <tr>
    <th id="yr2_Mar" class="rowHead">March</th>
    <td headers="yr2_IE yr2_Mar">43.3 %</td>
    <td headers="yr2_FF yr2_Mar">46.5%</td>
    <td headers="yr2_Chrome yr2_Mar">4.2%</td>
    <td headers="yr2_Safari yr2_Mar">3.1%</td>
    <td headers="yr2_Opera yr2_Mar">2.3%</td>
  </tr>
  <tr>
    <th id="yr2_Feb" class="rowHead">February</th>
    <td headers="yr2_IE yr2_Feb">43.6 %</td>
    <td headers="yr2_FF yr2_Feb">46.4%</td>
    <td headers="yr2_Chrome yr2_Feb">4.0%</td>
    <td headers="yr2_Safari yr2_Feb">3.0%</td>
    <td headers="yr2_Opera yr2_Feb">2.2%</td>
  </tr>
  <tr>
    <th id="yr2_Jan" class="rowHead">January</th>
    <td headers="yr2_IE yr2_Jan">44.8 %</td>
    <td headers="yr2_FF yr2_Jan">45.5%</td>
    <td headers="yr2_Chrome yr2_Jan">3.9%</td>
    <td headers="yr2_Safari yr2_Jan">3.0%</td>
    <td headers="yr2_Opera yr2_Jan">2.3%</td>
  </tr>
</tbody></table>
<p id="reference">Data is from <a href="http://www.w3schools.com/browsers/browsers_stats.asp">www.w3schools.com</a></p>
</div>

CSS Code


div.wrapper {
   margin: 20px;
   padding: 10px;
   overflow: visible;
   background-color: #faf7f0;
   border: 1px solid #880000;
   -webkit-border-radius: 10px; /* Safari and Chrome rounded corners */
   -moz-border-radius: 10px; /* Firefox rounded corners */
   border-radius: 10px; /* Opera rounded corners */
}
table.statsTable {
   width: 100%;
   border-collapse: collapse;
}
table.statsTable caption{
   margin: 10px;
   font-size: 120%;
   font-weight: bold;
}
table.statsTable th.heading {
   padding: 2px 5px;
   text-align: center;
   font-weight: bold;
   background-color: #f9f9f9;
   border-bottom: 2px solid black;
}
table.statsTable th.rowHead {
   width: 10%;
   padding: 2px 5px;
   text-align: left;
   font-weight: normal;
}
table.statsTable tbody td {
   width: 18%;
   padding: 2px 5px;
   text-align: right;
}

p#reference {
   margin-top: 2px;
   font-size: 80%;
}
.odd {
   background-color: #ffffee;
}
.even {
   background-color: #fff;
}

Javascript Source Code


// Define a small jQuery extension to alternate table row colors
jQuery.fn.alternateRowColors = function() {
   $('tbody tr:odd', this).addClass('odd');
   $('tbody tr:even', this).addClass('even');

   return this;
};

$(document).ready(function() {
   $('table.statsTable').alternateRowColors();
});