style(Account Tag List): Add a float left to better manage a category

src/components/TagList.vue

@@ -2,19 +2,12 @@
   <div class="tag-list columns is-multiline is-centered">
     <div class="column legend-container">
       <table class="table">
-        <tr
+        <tr v-for="(slice, k) in slices" :key="k" :style="legendStyle(slice)" class="legend-item">
-          v-for="(slice, k) in slices"
-          :key="k"
-          :style="legendStyle(slice)"
-          class="legend-item"
-        >
           <td>
             <awe-icon :icon="categories[slice.key].tag.icon" />
           </td>
           <td class="legend-label">{{ slice.label }}</td>
-          <td class="percent-label numeric">
+          <td class="percent-label numeric">{{ Math.round(slice.percent * 100) }}%</td>
-            {{ Math.round(slice.percent * 100) }}%
-          </td>
         </tr>
       </table>
     </div>
@@ -34,48 +27,42 @@
           <div class="select is-fullwidth">
             <select v-model="filterCategory">
               <option value>Toutes</option>
-              <option v-for="(category, k) in categories" :key="k" :value="k">{{
+              <option v-for="(category, k) in categories" :key="k" :value="k">
+                {{
                 category.tag.label
-              }}</option>
+                }}
+              </option>
             </select>
           </div>
         </div>
       </div>
       <div
-        class="columns is-multiline"
+        v-for="(category, k) in filteredCategories"
-        :class="{ 'is-centered': !!filterCategory }"
+        :key="k"
+        class="category-list-container column is-half"
       >
-        <div
+        <div class="columns category-list">
-          v-for="(category, k) in filteredCategories"
+          <div class="column is-2 tag-element account-color">
-          :key="k"
+            <div class="icon-container">
-          class="column is-half"
+              <awe-icon :icon="category.tag.icon" />
-        >
-          <div class="columns category-list">
-            <div class="column is-2 tag-element account-color">
-              <div class="icon-container">
-                <awe-icon :icon="category.tag.icon" />
-              </div>
-            </div>
-            <div
-              class="column transaction-list"
-              v-if="category.transactions.length"
-            >
-              <p>
-                {{
-                  $tc('account.total', category.transactions.length, {
-                    count: category.transactions.length
-                  })
-                }}
-              </p>
-              <account-transaction-list
-                :filter="false"
-                :head="false"
-                :foot="true"
-                :account="account"
-                :transactions="category.transactions"
-              />
             </div>
           </div>
+          <div class="column transaction-list" v-if="category.transactions.length">
+            <p>
+              {{
+              $tc('account.total', category.transactions.length, {
+              count: category.transactions.length
+              })
+              }}
+            </p>
+            <account-transaction-list
+              :filter="false"
+              :head="false"
+              :foot="true"
+              :account="account"
+              :transactions="category.transactions"
+            />
+          </div>
         </div>
       </div>
     </div>
@@ -209,4 +196,7 @@ export default class TagList extends Vue {
 .percent-label {
   text-align: right;
 }
+.category-list-container {
+  float: left;
+}
 </style>