diff --git a/frontend/src/components/dashboard/TopBoxes.vue b/frontend/src/components/dashboard/TopBoxes.vue
index 3178b71133..0a64e0fcde 100644
--- a/frontend/src/components/dashboard/TopBoxes.vue
+++ b/frontend/src/components/dashboard/TopBoxes.vue
@@ -30,7 +30,7 @@
           <span v-if="error" class="info-box-text"><i class="fas fa-exclamation-triangle text-danger"></i></span>
           <!-- balance in preferred currency -->
           <span v-for="balance in prefCurrencyBalances" :title="balance.sub_title" class="info-box-number">{{ balance.value_parsed }}</span>
-
+          <span v-if="0 === prefCurrencyBalances.length" class="info-box-number">&nbsp;</span>
           <div class="progress bg-info">
             <div class="progress-bar" style="width: 0"></div>
           </div>
@@ -55,6 +55,7 @@
           <span v-if="error" class="info-box-text"><i class="fas fa-exclamation-triangle text-danger"></i></span>
           <!-- bills unpaid, in preferred currency. -->
           <span v-for="balance in prefBillsUnpaid" class="info-box-number">{{ balance.value_parsed }}</span>
+          <span v-if="0===prefBillsUnpaid.length" class="info-box-number">&nbsp;</span>
 
           <div class="progress bg-teal">
             <div class="progress-bar" style="width: 0"></div>
@@ -80,6 +81,7 @@
           <span v-if="error" class="info-box-text"><i class="fas fa-exclamation-triangle text-danger"></i></span>
           <!-- left to spend in preferred currency -->
           <span v-for="left in prefLeftToSpend" :title="left.sub_title" class="info-box-number">{{ left.value_parsed }}</span>
+          <span v-if="0 === prefLeftToSpend.length" class="info-box-number">&nbsp;</span>
 
           <div class="progress bg-success">
             <div class="progress-bar" style="width: 0"></div>