@@ -201,7 +201,7 @@ pre, .highlight, .gist-highlight {

 }

 .highlight code { @extend .pre-code; background: #000;}

-figure[role=code] {

+figure.code {

   background: none;

   padding: 0;

   border: 0;

@@ -27,7 +27,7 @@ module BacktickCodeBlock

       end

       if @lang.nil? || @lang == 'plain'

         code = tableize_code(str.gsub('<','&lt;').gsub('>','&gt;'))

-        "<figure role=code>#{@caption}#{code}</figure>"

+        "<figure class='code'>#{@caption}#{code}</figure>"

       else

         if @lang.include? "-raw"

           raw = "``` #{@options.sub('-raw', '')}\n"

@@ -35,7 +35,7 @@ module BacktickCodeBlock

           raw += "\n```\n"

         else

           code = highlight(str, @lang)

-          "<figure role=code>#{@caption}#{code}</figure>"

+          "<figure class='code'>#{@caption}#{code}</figure>"

         end

       end

     end

@@ -30,12 +30,12 @@ module HighlightCode

     highlighted_code

   end

   def tableize_code (str, lang = '')

-    table = '<div class="highlight"><table cellpadding="0" cellspacing="0"><tr><td class="gutter"><pre class="line-numbers">'

+    table = '<div class="highlight"><table><tr><td class="gutter"><pre class="line-numbers">'

     code = ''

     str.lines.each_with_index do |line,index|

-      table += "<span class='line'>#{index+1}</span>\n"

-      code  += "<div class='line'>#{line}</div>"

+      table += "<span class='line-number'>#{index+1}</span>\n"

+      code  += "<span class='line'>#{line}</span>"

     end

-    table += "</pre></td><td class='code' width='100%'><pre><code class='#{lang}'>#{code}</code></pre></td></tr></table></div>"

+    table += "</pre></td><td class='code'><pre><code class='#{lang}'>#{code}</code></pre></td></tr></table></div>"

   end

 end