anchor.diff:  
         a.navbar-brand { color: #FFF !important; }
   
  +      .tab-pane { padding-top: 10px; }
  +
         /* Explanations */
         .w3c_explanation { border: 1px solid #ddd; background-color: #ffe; padding: 10px; margin: 5px 5px 25px 5px; font-size: 0.8em; }
         .helpwanted { float: right; font-size: 2em; }
  
positive.code: 
      </div>
  
      <script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
  
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
      <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
      <script type="text/javascript">
        $('.accordion').accordion({active: 'false', heightStyle: 'content' });
      </script>
  
      <script src="https://sitevalidator.com/cdn/highlightjs/7.3/highlight.min.js"></script>
      <script type="text/javascript">
        hljs.initHighlightingOnLoad();
      </script>
    </body>
  </html>
  
negative.code: 
        <h1>MARKUP VALIDATION FOR <a href='<%= @url %>'><%= @url %></a></h1>
  
        <ul class="nav nav-tabs">
          <li class="active"><a href="#urls">List of URLs</a></li>
          <li><a href="#errors"><%= errors.length %> HTML errors</a></li>
          <li><a href="#warnings"><%= warnings.length %> HTML warnings</a></li>
        </ul>
  
        <div class="tab-content">
          <div class="tab-pane active" id="urls">
            <% processed_pages = pages.select{|p| !p.exception} %>
            <% if processed_pages.size > 0 %>
              <% processed_pages.each do |page| %>
                <div class='page'>
                  <h3>
                    <a href='<%= page.url %>'><%= page.url %></a>
                    <span class="label label-danger"><%= "#{page.errors.length} errors" %></span>
                    <span class="label label-warning"><%= "#{page.warnings.length} warnings" %></span>
                  </h3>
  
                  <div class="accordion">
                    <% page.errors.sort_by {|e| e.line.to_i}.each do |error| %>
                      <h3>
                        <span class="label label-danger">ERROR</span>
                        <%= CGI::escapeHTML(error.text.capitalize) %>
                      </h3>
  
                      <div>
                        <% if error.line && error.col %>
                          <span class="coordinates label">
                            LINE <%= error.line %>, COL <%= error.col %>
                          </span>
                        <% end %>
  
                        <% if error.source && error.source.strip.length > 0 %>
                          <pre><code class="html"><%= error.source.strip %></code></pre>
                        <% end %>
  
                        <% if error.explanation && error.explanation.strip.length > 0 %>
                          <div class="w3c_explanation"><%= error.explanation.strip %></div>
                        <% end %>
                      </div>
  
                    <% end %>
                  </div>
  
                  <div class="accordion">
                    <% page.warnings.sort_by {|w| w.line.to_i}.each do |warning| %>
                      <h3>
                        <span class="label label-warning">WARNING</span>
                        <%= CGI::escapeHTML(warning.text.capitalize) %>
                      </h3>
  
                      <div>
                        <% if warning.line && warning.col %>
                          <span class="coordinates label">
                            LINE <%= warning.line %>, COL <%= warning.col %>
                          </span>
                        <% end %>
  
                        <% if warning.source && warning.source.strip.length > 0 %>
                          <pre><code class="html"><%= warning.source.strip %></code></pre>
                        <% end %>
  
                        <% if warning.explanation && warning.explanation.strip.length > 0 %>
                          <div class="w3c_explanation"><%= warning.explanation.strip %></div>
                        <% end %>
                      </div>
  
                    <% end %>
                  </div>
                </div>
              <% end %>
            <% end %>
          </div>
  
          <div class="tab-pane" id="errors">
            <% if errors.length > 0 %>
              <div class="accordion">
              <% errors.group_by {|e| e.text}.sort_by {|t, e| e.length}.reverse.each do |text, errors| %>
                <h3><span class="label label-danger"><%= errors.length %></span> <%= CGI::escapeHTML(text.capitalize) %></h3>
                <div>
                  <% if errors.first.explanation && errors.first.explanation.strip.length > 0 %>
                    <div class="w3c_explanation"><%= errors.first.explanation.strip %></div>
                  <% end %>
                </div>
              <% end %>
              </div>
            <% end %>
          </div>
  
          <div class="tab-pane" id="warnings">
            <% if warnings.length > 0 %>
              <div class="accordion">
              <% warnings.group_by {|w| w.text}.sort_by {|t, w| w.length}.reverse.each do |text, warnings| %>
                <h3><span class="label label-warning"><%= warnings.length %></span> <%= CGI::escapeHTML(text.capitalize) %></h3>
                <div>
                  <% if warnings.first.explanation && warnings.first.explanation.strip.length > 0 %>
                    <div class="w3c_explanation"><%= warnings.first.explanation.strip %></div>
                  <% end %>
                </div>
              <% end %>
              </div>
            <% end %>
          </div>
        </div>
  
        <hr />
  
  