diff --git a/apps/files/templates/appnavigation.php b/apps/files/templates/appnavigation.php
index 09b0294368..6a7b4e4b11 100644
--- a/apps/files/templates/appnavigation.php
+++ b/apps/files/templates/appnavigation.php
@@ -11,7 +11,7 @@
 			</a>
 		</li>
 		<?php } ?>
-		<li id="quota" class="section pinned <?php
+		<li id="quota" class="pinned <?php
 		if ($_['quota'] !== \OCP\Files\FileInfo::SPACE_UNLIMITED) {
 			?>has-tooltip" title="<?php p($_['usage_relative'] . '%');
 		} ?>">
@@ -23,9 +23,8 @@
 						p($l->t('%s used', [$_['usage']]));
 					} ?></p>
 				<div class="quota-container">
-					<div style="width:<?php p($_['usage_relative']);?>%"
-						 <?php if($_['usage_relative'] > 80): ?>class="quota-warning"<?php endif; ?>>
-					</div>
+					<progress value="<?php p($_['usage_relative']); ?>" max="100"
+						<?php if($_['usage_relative'] > 80): ?> class="quota-warning" <?php endif; ?>></progress>
 				</div>
 			</a>
 		</li>
diff --git a/core/css/styles.scss b/core/css/styles.scss
index 4a47d192ef..3b062250df 100644
--- a/core/css/styles.scss
+++ b/core/css/styles.scss
@@ -925,7 +925,7 @@ code {
 	font-family: 'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono', monospace;
 }
 
-#quota {
+#body-settings #quota {
 	cursor: default;
 	margin: 30px !important;
 	position: relative;