FIX: don't use a table for poll results

plugins/poll/assets/javascripts/components/poll-results-standard.js.es6

@@ -1,5 +1,5 @@
 export default Em.Component.extend({
-  tagName: "table",
+  tagName: "ul",
   classNames: ["results"],
 
   options: function() {

plugins/poll/assets/javascripts/discourse/templates/components/poll-results-standard.hbs

@@ -1,11 +1,13 @@
 {{#each option in options}}
-  <tr>
-    <td class="option">{{{option.html}}}</td>
-    <td class="percentage">{{option.percentage}}%</td>
-  </tr>
-  <tr>
-    <td colspan="2" class="bar-back">
+  <li>
+    <div class="option">
+      <p>
+        <span class="percentage">{{option.percentage}}%</span>
+        {{{option.html}}}
+      </p>
+    </div>
+    <div class="bar-back">
       <div class="bar" style={{option.style}}></div>
-    </td>
-  </tr>
+    </div>
+  </li>
 {{/each}}

plugins/poll/assets/stylesheets/common/poll.scss

@@ -18,9 +18,10 @@ div.poll {
     width: 100%;
   }
 
-  li, .option {
+  li {
     cursor: pointer;
-    font-size: 1.125em;
+    font-size: 15px;
+    margin-bottom: 10px;
   }
 
   li[data-poll-option-id] {
@@ -28,7 +29,6 @@ div.poll {
     background: $option-background;
     box-shadow: inset 0 -6px rgba(0,0,0,.25), inset 0 0 0 100px rgba(0,0,0,0);
     padding: .5em .7em .7em .5em;
-    margin-bottom: 10px;
     border-radius: 4px;
 
     &:hover {
@@ -92,18 +92,16 @@ div.poll {
 
   .results {
 
-    width: 100%;
-
     .option {
-      max-width: 90%;
-      padding-right: 1.6em;
+      padding-bottom: 5px;
+      p {
+        margin: 0;
+      }
     }
 
     .percentage {
-      width: 10%;
-      font-size: 1.7em;
-      text-align: right;
-      vertical-align: middle;
+      font-size: 25px;
+      float: right;
       color: $text-color;
     }