diff --git a/src/theme.scss b/src/theme.scss
index 336c78f9a..b3339951d 100644
--- a/src/theme.scss
+++ b/src/theme.scss
@@ -69,6 +69,10 @@ $state-danger-border:                       $brand-danger;
 // Bootstrap extension
 // ----------------------------
 
+.text-monospace {
+    font-family: $font-family-monospace;
+}
+
 .row-same-height {
     height: 100%;
     display: table;
diff --git a/src/views/app.html b/src/views/app.html
index 2337b9a7f..2971141b0 100644
--- a/src/views/app.html
+++ b/src/views/app.html
@@ -1017,7 +1017,7 @@
               <div class="form-group" ng-class="{ 'has-error': cron.error.crontab }">
                 <label class="control-label" style="width: 100%">{{ 'app.cron.title' | tr }} <sup><a ng-href="https://docs.cloudron.io/apps/#cron" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></label>
                 <div ng-show="cron.error.crontab"><small>{{ cron.error.crontab }}</small></div>
-                <textarea ng-trim="false" style="white-space: pre-wrap" ng-model="cron.crontab" class="form-control" rows="10"></textarea>
+                <textarea ng-trim="false" style="white-space: pre-wrap" ng-model="cron.crontab" class="form-control text-monospace" rows="10"></textarea>
               </div>
 
               <input class="ng-hide" type="submit" ng-disabled="cronForm.$invalid || cron.busy"/>
@@ -1069,13 +1069,13 @@
             <form role="form" name="securityForm" ng-submit="security.submit()" autocomplete="off">
               <div class="form-group">
                 <label class="control-label" style="width: 100%">{{ 'app.security.robots.title' | tr }} <sup><a ng-href="https://docs.cloudron.io/apps/#robotstxt" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup> <a href="" class="pull-right" style="font-weight: normal;" ng-click="security.robotsTxt = ROBOTS_DISABLE_INDEXING_TEMPLATE">{{ 'app.security.robots.disableIndexingAction' | tr }}</a></label>
-                <textarea ng-trim="false" style="white-space: pre-wrap" ng-model="security.robotsTxt" placeholder="{{ 'app.security.robots.txtPlaceholder' | tr }}" class="form-control" rows="4"></textarea>
+                <textarea ng-trim="false" style="white-space: pre-wrap" ng-model="security.robotsTxt" placeholder="{{ 'app.security.robots.txtPlaceholder' | tr }}" class="form-control text-monospace" rows="4"></textarea>
               </div>
 
               <div class="form-group">
                 <label class="control-label" style="width: 100%">{{ 'app.security.csp.title' | tr }} <sup><a ng-href="https://docs.cloudron.io/apps/#custom-csp" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup> </label>
                 <p>{{ 'app.security.csp.description' | tr }}</p>
-                <textarea ng-model="security.csp" placeholder="default-src 'self'; frame-ancestors 'none';" class="form-control" rows="2"></textarea>
+                <textarea ng-model="security.csp" placeholder="default-src 'self'; frame-ancestors 'none';" class="form-control text-monospace" rows="2"></textarea>
               </div>
 
               <input class="ng-hide" type="submit" ng-disabled="securityForm.$invalid || security.busy"/>